Prince: "Explorer Navigationsleiste"

SELF-Forum

"Explorer Navigationsleiste"

Prince
– Informationen zu den Bewertungsregeln

Hallo,

ich bin Azubi zum Informatikkaufmann und arbeite im Moment an einer Intranetseite für eine Abteilung bei uns im Betrieb. Da dies meine erste Internetseite ist die ich erstelle hapert es an der ein oder anderen Stelle noch ein bisschen, daher bitte ich um Verständnis wenn meine Fragen nicht sonderlich intelligent wirken. Danke! :)

So nun aber endlich zu meinen Problem. Ich habe auf www.asperg.de eine Navigationsleiste gesehen, die ich auf meiner Page gerne ähnlich umsetzen würde. Die einzige Anderung ist die Schriftfarbe (wahrscheinlich das kleinste prob bei der sache) und das die "+" zeichen automatisch auf und wieder zuklappen wenn ich mit dem Mauszeiger drüberfahre.

Da ich den Quelltext leider nicht rauskopieren kann frage ich mich wie ich so ein Menü erstellen kann. Gibt es vielleicht irgendein Tool mit dem das umsetzbar ist? Oder ein Tutorial in dem es genau erklärt ist?
Java kann ich zwar ein wenig , aber zu wenig um schon etwas selbst zu coden...

Kurzgesagt: Gibt es irgendeine Möglichkeit so ein Menü zu erstellen auch wenn man noch fast keine Ahnung von Pages hat?

Schonmal danke an diejenigen die sich die Mühe gemacht haben das hier zu lesen. Wenn ihr jetzt noch den ein oder anderen Vorschlag hättet wärs Perfekt! :)

Danke!
Greetz Prince

Beitrag melden
–
Informationen zu den Bewertungsregeln

  1. "Explorer Navigationsleiste"

    romy
    – Informationen zu den Bewertungsregeln

    Hi Prince,

    wenn Du ein bisschen mit Google suchst findest Du Unmengen an Aufklappmenues
    Hier ein Beispiel:
    http://www.jsunity.de/javascript/scripts/javascript_0359_main.shtml
    Nimm Dir ein Beispiel, passe es etwas an und frage wieder nach, wenn es zu Problemen kommt.
    Allerdings würde ich weder ein Java noch ein Javascript-Menu empfehlen, ausser es gibt eine Textalternative.

    Viel Spass

    ciao
    romy

    --
    DIE ROMY AUS L. AN DER P. SAGT DANKE UND AUF WIEDERSEHEN
    http://www.peter.in-berlin.de/projekte/selfcode/?code=sh%3A(+fo%3A)+rl%3A(+br%3A>+ch%3A~+n4%3A%26+ie%3A%25+mo%3A)+va%3A|+de%3A<+zu%3A|+fl%3A(+ss%3A)+ls%3A[
    Beitrag melden
    –
    Informationen zu den Bewertungsregeln

    1. "Explorer Navigationsleiste"

      Prince
      – Informationen zu den Bewertungsregeln

      Hallo,

      erstma Danke Romy.
      Jetzt habe ich folgendes Problem:

      Ich habe die Navigationsleiste als Hintergrundbild definiert das ich auf sie "schreiben" kann. Wenn ich dann das Javascript einfüge verschiebt er das Bild nach unten obwohl es als Hintergrundbild definiert ist.. :/
      Kann mir einer sagen woran das liegt und was ich dagegen tun kann?

      Danke!

      Gruß Prince

      <!-- saved from url=(0022)http://internet.e-mail -->
      <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 //EN">
      <html>
      <head>
      <title></title>
      <style type="text/css">
      #Navigation {
       background-image:url(hgr_nz1.jpeg); background-repeat:no-repeat;
       background-position:0px 0px;
      }
      </style>

      <style>
      <!--
      #foldheader{cursor:pointer;cursor:hand ; font-weight:bold ;
      //list-style-image:url(fold.gif)}
      #foldinglist{list-style-image:url(list.gif)}
      //-->
      </style>
      <script language="JavaScript1.2">
      <!--

      //Smart Folding Menu tree- By Dynamic Drive (rewritten 03/03/02)
      //For full source code and more DHTML scripts, visit http://www.dynamicdrive.com
      //This credit MUST stay intact for use

      var head="display:''"
      img1=new Image()
      img1.src="fold.gif"
      img2=new Image()
      img2.src="open.gif"

      var ns6=document.getElementById&&!document.all
      var ie4=document.all&&navigator.userAgent.indexOf("Opera")==-1

      function checkcontained(e){
      var iscontained=0
      cur=ns6? e.target : event.srcElement
      i=0
      if (cur.id=="foldheader")
      iscontained=1
      else
      while (ns6&&cur.parentNode||(ie4&&cur.parentElement)){
      if (cur.id=="foldheader"||cur.id=="foldinglist"){
      iscontained=(cur.id=="foldheader")? 1 : 0
      break
      }
      cur=ns6? cur.parentNode : cur.parentElement
      }

      if (iscontained){
      var foldercontent=ns6? cur.nextSibling.nextSibling : cur.all.tags("UL")[0]
      if (foldercontent.style.display=="none"){
      foldercontent.style.display=""
      cur.style.listStyleImage="url(open.gif)"
      }
      else{
      foldercontent.style.display="none"
      cur.style.listStyleImage="url(fold.gif)"
      }
      }
      }

      if (ie4||ns6)
      document.onclick=checkcontained

      //-->
      </script>

      <ul>
         <li id="foldheader">News</li>
         <ul id="foldinglist" style="display:none" style=&{head};>
            <li><a href="http://www.cnn.com">CNN</a></li>
            <li><a href="http://www.abcnews.com">ABC News</a></li>
            <li><a href="http://www.news.bbc.co.uk">BBC News</a></li>
         </ul>

      <li id="foldheader">Webmaster</li>
         <ul id="foldinglist" style="display:none" style=&{head};>
            <li><a href="http://www.dynamicdrive.com">Dynamic Drive</a></li>
            <li><a href="http://www.javascriptkit.com">JavaScript Kit</a></li>
            <li><a href="http://www.freewarejava.com">Freewarejava.com</a></li>
         </ul>

      <li id="foldheader">Nested Example</li>
         <ul id="foldinglist" style="display:none" style=&{head};>
            <li><a href="http://www.dynamicdrive.com">outer 1</a></li>
            <li><a href="http://www.dynamicdrive.com">outer 2</a></li>
            <li id="foldheader">Nested</li>
            <ul id="foldinglist" style="display:none" style=&{head};>
               <li><a href="http://www.dynamicdrive.com">nested 1</a></li>
               <li><a href="http://www.dynamicdrive.com">nested 2</a></li>
            </ul>
            <li><a href="http://www.dynamicdrive.com">outer 3</a></li>
            <li><a href="http://www.dynamicdrive.com">outer 4</a></li>
         </ul>
      </ul>

      </head>

      <body bgcolor="#b4c4de">

      <div id="Navigation">
      <H1></H1><p> </p><p> </p><p> </p><p> </p><p> </p><p> </p><p> </p><p> </p><p> </p><p> </p><p> </p><p> </p><p> </p><p> </p><p> </p></div>

      </body>
      </html>

      Beitrag melden
      –
      Informationen zu den Bewertungsregeln

      1. "Explorer Navigationsleiste"

        romy
        – Informationen zu den Bewertungsregeln

        Hi Prince,

        <script language="JavaScript1.2">

        type="text/javascript" fehlt -> ist aber nicht der Fehler

        </script>

        hier geht zwar script zu, aber nicht der head, der geht erst nach der Liste zu. Die Liste muss aber im Body-Bereich stehen. Ob das Problem damit gelöst ist, weiss ich nicht, aber ich könnte es mir vorstellen.

        [LISTE]

        </head>

        <body bgcolor="#b4c4de">

        ciao
        romy

        --
        DIE ROMY AUS L. AN DER P. SAGT DANKE UND AUF WIEDERSEHEN
        http://www.peter.in-berlin.de/projekte/selfcode/?code=sh%3A(+fo%3A)+rl%3A(+br%3A>+ch%3A~+n4%3A%26+ie%3A%25+mo%3A)+va%3A|+de%3A<+zu%3A|+fl%3A(+ss%3A)+ls%3A[
        Beitrag melden
        –
        Informationen zu den Bewertungsregeln