kostenloser Webspace werbefrei: lima-city


HTML-Quellcode, bewegliche Menü leiste?

lima-cityForumDie eigene HomepageHTML, CSS & Javascript

  1. Autor dieses Themas

    g********e

    Hallo alle zusammen,
    ich bin gerade an meiner Homepage am weiterarbeiten und bleibe ganz am anfang hängen! Ich bin zwar schon eine Zeit in der Homepage Brange aber habe wirklich keine Ahnung wie man eine Bewegliche Menüleiste macht! Ich habe mal geguckt, man findet gar nix!

    Falls ihr nicht wisst was ich mit "beweglich" meine, das wenn man mit der Maus über ein Menü oben geht, das sich nach unten was öffnet wo man dann auswählen kann! Eigentlich so ähnlich wie unten bei Windows die Menüleiste!


    Danke im Vorraus!
  2. Diskutiere mit und stelle Fragen: Jetzt kostenlos anmelden!

    lima-city: Gratis werbefreier Webspace für deine eigene Homepage

  3. m**********n

    Lerne JavaScript! Das gibt dir viel Macht über seine Website, vor allem, wenn du JQuery benutzt. Das ist ein Javascript-Framework, welches dir viele Aufgaben erleichtert, das geht dann so in etwa:
    $(".navitem").hover({
        $(this).find(".subitem").css("display: block;")
    });


    Ich habe mich schon länger nicht mehr mit JQuery befasst, kann also fehlerhaft sein ;)

    Mfg

    Mator
  4. Autor dieses Themas

    g********e

    ja danke,
    aber wenn ich auf einem Doku bin und da auf "Quelltext" gehe kann ich doch nicht irrgendwie auf einmal JavaSkript schreiben! Gibs da irrgendwelche umwandlungspogramme oder so? Und gibs für die PC-Sprache eine "kostenlose" Online Schule oder noch besser ein Lernpogram?
  5. Hallo giga-score,
    vielleicht meinst du so etwas in der Art:
    <html>
     <head>
      <title>Vorschlag</title>
      <script>
       function show_submenu_1() {
        document.getElementById('menu').innerHTML=('<img src="open_submenu_1.png" border="0" usemap="#menu" />');
        change2();
       }
       function show_submenu_2() {
        document.getElementById('menu').innerHTML=('<img src="open_submenu_2.png" border="0" usemap="#menu" />');
       }
       function hide() {
        document.getElementById('menu').innerHTML=('<img src="menu.png" border="0" usemap="#menu" />');
       }
      </script>
     <head>
     <body>
      <div id="menu"><img src="menu.png" border="0" usemap="#menu" /></div>
    
      <map name="menu">
       <area shape="rect" coords="0,0,200,32" href="#" onmouseover=show_submenu_1() onmouseout=hide() />
       <area shape="rect" coords="201,0,401,32" href="#" onmouseover=show_submenu_2() onmouseout=hide() />
    
       <area shape="rect" coords="0,0,200,64" href="#" onmouseover=show_submenu_1() onmouseout=hide() />
       <area shape="rect" coords="201,0,401,64" href="#" onmouseover=show_submenu_2() onmouseout=hide() />
      </map>
     </body>
    </html>

    Die Grafiken sollten 400px breit und 64px hoch sein.
    Vielleicht hilft es dir ja weiter.
    ByteBit

    Beitrag zuletzt geändert: 2.10.2011 20:15:40 von bytebit
  6. Autor dieses Themas

    g********e

    ka

    eigentlich(wascheinlich) schonn läd aber irrgendwie nicht!
  7. Hallo,
    hast du schon die Grafiken:
    - menu.png
    - open_submenu_1.png
    - open_submenu_2.png
    erstellt?
    Die Bilder müssen im selben Verzeichnis wie die Htmldatei liegen.
    bytebit
  8. Für Menüs dieser Art ist Javascript überflüssig! HTML und CSS reichen. ;)

    Stu Nicholls zeigt auf seiner Homepage diverse solcher Menüs.

    Hier ein einfaches Beispiel: *click*

    Schau dir die Quellcodesder Seiten an, dort findest Du alle Infos.

    FF

  9. Autor dieses Themas

    g********e

    ja genau solch nur das ich diese einfach als HTML Code einfügen muss^^
  10. s**s

    mal abgesehen das "drop down menues" ziemlich out sind unterstützen sie nicht gerade die benutzerfreundlichkeit.
  11. s86s schrieb:
    mal abgesehen das "drop down menues" ziemlich out sind unterstützen sie nicht gerade die benutzerfreundlichkeit.


    "out" ist eine Beschreibung persönlicher Vorlieben oder ein Zeichen für Trendgläubigkeit. Ergo kein Argument für oder gegen. ;)

    Wo siehst Du Probleme bei der Nutzerfreundlichkeit? Sie ermöglichen, eine Vielzahl von Optionen auf kleinem Raum darzustellen, Ermögliche auch, in der Seitenstruktur tieferliegende Inhalte mit einem Klick zu erreichen und sind, sofern sie vernünftig gemacht sind, sogar Barrierefrei.

    FF

  12. Diskutiere mit und stelle Fragen: Jetzt kostenlos anmelden!

    lima-city: Gratis werbefreier Webspace für deine eigene Homepage

Dir gefällt dieses Thema?

Über lima-city

Login zum Webhosting ohne Werbung!