Ergebnis 1 bis 10 von 10

Thema: Hilfe beim BaumDiagramm

  1. #1
    gelöschter User
    Gast

    Standard Hilfe beim BaumDiagramm

    also in der suche gab es ja ma ein thema mit dem baumdiagramm !
    Ich will soetwas ähnliches machen !

    auf http://javascript.welt-der-links.de/...explor/exm.htm seht ihr ein baumdiagramm!

    Hier meine Fantasy wie ich es gerne hätte

    Das ganze soll ohne frames sein und im prinzip nur das baumdiagramm

    Menü 1
    Menü 2

    wenn man es aufklappt

    Menü 1
    * blablabla
    * blablabla
    Menü 2
    * blablabla
    * blablabla

    und man soll es auch wieder zuklappen können ..

    Ich hab mich da dran versucht aber meine JavaScript kenntnisse sind so klein da geht das nicht so gut ..

    Mit vielen super glücklichen grüßen euer crazywulf
    Achtung: Dies ist ein alter Thread im HTML und Webmaster Forum
    Diese Diskussion ist älter als 90 Tage. Die darin enthaltenen Informationen sind möglicherweise nicht mehr aktuell. Erstelle bitte zu deiner Frage ein neues Thema im Forum !!!!!

  2. #2
    Fortgeschrittene/r
    Registriert seit
    21.11.2004
    Ort
    Bremen
    Beiträge
    175
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings

    Standard

    Hi,

    meinst du sowas:
    http://kurzgeschichten.marcus-haas.de
    das basiert aber auf :hover (CSS, und funktioniert deshalb außer beim IE auch bei abgeschaltetem Javascript), man könnte das aber umbauen, sodass es bei onclick aufklappt, dann aber nur noch mit Javascript und das könnte bei Suchrobotern schwierigkeiten machen.

    Und hier der Code dazu:
    Javascript:
    Code:
    // wird nur im IE ausgeführt
    	if(document.selection) {
    		var menu = document.getElementById('menu').getElementsByTagName('li');
    		for &#40;i=0;i<menu.length;i++&#41; &#123;
    			if &#40;menu&#91;i&#93;.lastChild.nodeName == "UL"&#41; &#123;
    				menu&#91;i&#93;.onmouseover = function &#40;&#41; &#123;
    					this.lastChild.style.display = "block";
    				&#125;
    				menu&#91;i&#93;.onmouseout = function &#40;&#41; &#123;
    					this.lastChild.style.display = "none";
    				&#125;
    			&#125;
    		&#125;
    	&#125;
    CSS:
    Code:
    #menu&#123;
    	top&#58;6em;
    	left&#58;-1em;
    	background-color&#58; #fff;
    &#125;
    #menu a&#123;
    	margin&#58;0;
    	padding&#58;3px;
    	border&#58;1px solid #d0d0d0;
    	border-left&#58;3px solid #aaaaaa;
    	display&#58;block;
    &#125;
    #menu a&#58;active&#123;border-left&#58;3px solid #ffff66&#125;
    #menu a&#58;visited&#123;border-left&#58;3px solid #ffcc00&#125;
    #menu a&#58;hover&#123;border-left&#58;3px solid #868686;&#125;
    #menu li&#123;
    	position&#58;relative;
    	list-style&#58;none;
    	width&#58;9em;
    	padding&#58;0;
    	margin&#58;0;
    	background-color&#58; #fff;
    	border&#58;2px solid #fff;
    &#125;
    /*Das hir soll zunächst nicht gezeigt werden*/
    #menu li ul, #menu li&#58;hover ul ul, #menu li&#58;hover ul li&#58;hover ul ul&#123; 
    	display&#58;none;
    	position&#58;absolute;
    	left&#58;6.5em;
    	top&#58;-2px;
    	z-index&#58;15;
    &#125;
    /*für die verschachtelten Listen, wenn man darüberfährt*/
    #menu li&#58;hover ul, #menu li&#58;hover li&#58;hover ul, #menu li&#58;hover ul li&#58;hover ul li&#58;hover ul&#123; 
    	display&#58;block;
    &#125;
    HTML (statt der Ebenen müssen hier natürlich links stehen):
    Code:
    <ul id="menu">[*]ebene1-1
        <ul>[*]ebene2-1
             <ul>[*]ebene4-2[*]ebene3-2[/list]
           [*]ebene2-2[/list]
      [*]ebene1-2[*]ebene1-3[*]ebene1-4[/list]
    ich hoffe das funktioniert so ad-hoc, ich habe das nämlich nicht nochmal getestet.

  3. #3
    gelöschter User
    Gast

    Standard

    Jo danke ! ES FUNZT !!!!!


    Gruß crazywulf

  4. #4
    Fortgeschrittene/r
    Registriert seit
    21.11.2004
    Ort
    Bremen
    Beiträge
    175
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings

    Standard

    Hi,

    gern geschehen. Ich hoffe, du hast das Design ein bißchen verändert

    Gruß
    Marcus

  5. #5
    gelöschter User
    Gast

    Standard

    stop läuft doch ned !



    warum is da so en abstand zwischen der navi und dem menu?
    warum reist der das bild scripts.gif so ein wenn er das menü ausfährt?


    hier mein code ! :

    Code:
    <html>
    <title>JavaScript</title>
    
    <SCRIPT LANGUAGE=JavaScript>
    // wird nur im IE ausgeführt
       if&#40;document.selection&#41; &#123;
          var menu = document.getElementById&#40;'menu'&#41;.getElementsByTagName&#40;'li'&#41;;
          for &#40;i=0;i<menu.length;i++&#41; &#123;
             if &#40;menu&#91;i&#93;.lastChild.nodeName == "UL"&#41; &#123;
                menu&#91;i&#93;.onmouseover = function &#40;&#41; &#123;
                   this.lastChild.style.display = "block";
                &#125;
                menu&#91;i&#93;.onmouseout = function &#40;&#41; &#123;
                   this.lastChild.style.display = "none";
                &#125;
             &#125;
          &#125;
       &#125; 
    </SCRIPT>
    
    <link rel="stylesheet" type="text/css"
    href="style.css">
    <body>
    [img]bild/navigation.gif[/img]
    <ul id="menu">[*][img]bild/scripts.gif[/img]
    <ul>[*]<font color="blue">
    Newsletter 0.1  [img]bild/download1.gif[/img]  [img]bild/vorschau.gif[/img]
    
    </font>[*]ebene2-2[/list]
    [*]ebene1-2[*]ebene1-3[*]ebene1-4[/list]
    
    </body>
    <html>

  6. #6
    Fortgeschrittene/r
    Registriert seit
    21.11.2004
    Ort
    Bremen
    Beiträge
    175
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings

    Standard

    Hi,

    vesuch mal:
    Code:
    #menu&#123; 
       margin&#58;0;
       padding&#58;0;
    &#125;
    #menu a&#123; 
       margin&#58;0; 
       padding&#58;0;
       display&#58;block; 
    &#125;
    #menu li&#123; 
       position&#58;relative; 
       list-style&#58;none; 
       width&#58;<hier muss die Breite des Menüs in px stehen>px; 
       padding&#58;0; 
       margin&#58;0; 
    &#125; 
    /*Das hir soll zunächst nicht gezeigt werden*/ 
    #menu li ul, #menu li&#58;hover ul ul, #menu li&#58;hover ul li&#58;hover ul ul&#123; 
       display&#58;none; 
       position&#58;absolute;
       /*Abstand von links, wenn er größer ist als die Breite, dann
        klappts nicht */
       left&#58;<hier muss auch die Breite des Menüs in px stehen>px; 
    &#125; 
    /*für die verschachtelten Listen, wenn man darüberfährt*/ 
    #menu li&#58;hover ul, #menu li&#58;hover li&#58;hover ul, #menu li&#58;hover ul li&#58;hover ul li&#58;hover ul&#123; 
       display&#58;block; 
    &#125;
    da müssten die unnötigen Formatierungen raus sein.

    Gruß
    Marcus

  7. #7
    gelöschter User
    Gast

    Standard

    Ich hab die abstände da eingetrangen und von 0 px bis zu 500 px ausprobiert kam immer das gleiche raus !



    und ich wenn ich runter mit dem zeiger gehe is es weg nur wenn ich nach link s gehe bleibt das menü da sehr verwirrent ...

    p.s.

    code der style.css

    Code:
    #menu&#123;
       margin&#58;0;
       padding&#58;0;
    &#125;
    #menu a&#123;
       margin&#58;0;
       padding&#58;0;
       display&#58;block;
    &#125;
    #menu li&#123;
       position&#58;relative;
       list-style&#58;none;
       width&#58;200 px;
       padding&#58;0;
       margin&#58;0;
    &#125;
    /*Das hir soll zunächst nicht gezeigt werden*/
    #menu li ul, #menu li&#58;hover ul ul, #menu li&#58;hover ul li&#58;hover ul ul&#123;
       display&#58;none;
       position&#58;absolute;
       /*Abstand von links, wenn er größer ist als die Breite, dann
        klappts nicht */
       left&#58;200 px;
    &#125;
    /*für die verschachtelten Listen, wenn man darüberfährt*/
    #menu li&#58;hover ul, #menu li&#58;hover li&#58;hover ul, #menu li&#58;hover ul li&#58;hover ul li&#58;hover ul&#123;
       display&#58;block;
    &#125;

  8. #8
    Forum Guru
    Registriert seit
    28.12.2004
    Ort
    Ringgenberg(bei Interlaken) / Schweiz
    Beiträge
    4.787
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings

    Standard

    So und hir die Lösung des ganzen!!!!
    Angehängte Dateien Angehängte Dateien

  9. #9
    Fortgeschrittene/r
    Registriert seit
    21.11.2004
    Ort
    Bremen
    Beiträge
    175
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings

    Standard

    Hi,

    sorry, das ich ich mich nicht früher wieder melden konnte, ist das Problem jetzt tatsächlich gelöst, ansonsten kannst du vielleicht mal nen Link auf die Seite setzen, live kann ich mir das besser anschauen.

    Gruß
    Marcus

  10. #10
    Forum Guru
    Registriert seit
    28.12.2004
    Ort
    Ringgenberg(bei Interlaken) / Schweiz
    Beiträge
    4.787
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings

    Standard

    Ja ist es. Denn ich habe es mit ihm gemeinsam per ICQ gelöst.

Ähnliche Themen

  1. Hilfe beim BLOG !
    Von Joy im Forum HTML & CSS Forum
    Antworten: 3
    Letzter Beitrag: 03.10.2007, 15:20
  2. Baumdiagramm
    Von Ytnam im Forum Off Topic und Quasselbox
    Antworten: 4
    Letzter Beitrag: 15.05.2007, 11:05
  3. Hilfe beim Backen
    Von Taurus im Forum Off Topic und Quasselbox
    Antworten: 7
    Letzter Beitrag: 15.02.2006, 13:35
  4. Hilfe beim IFrame
    Von Mic-Style im Forum HTML & CSS Forum
    Antworten: 2
    Letzter Beitrag: 04.08.2005, 13:50
  5. Baumdiagramm erzeugen
    Von Razzel im Forum HTML & CSS Forum
    Antworten: 6
    Letzter Beitrag: 02.11.2004, 12:58

Stichworte

Berechtigungen

  • Neue Themen erstellen: Nein
  • Themen beantworten: Nein
  • Anhänge hochladen: Nein
  • Beiträge bearbeiten: Nein
  •