Seite 1 von 2 12 LetzteLetzte
Ergebnis 1 bis 10 von 17

Thema: HTML DropDown Menu

  1. #1
    Bash
    Gast

    Standard HTML DropDown Menu

    Kann mir einer sagen wie es geht folgendes zu coden:
    Ich will ein Text wo man mehr lesen drücken kann und sich dann unter diesem noch mehr Text öffnet. Es sollte sich nicht die ganze Seite neu laden.
    THX schon ma
    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
    Forum Guru Avatar von driver
    Registriert seit
    10.04.2006
    Alter
    34
    Beiträge
    20.729
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings

    Standard

    also n dropdown findest hier:
    http://barrierefrei.e-workers.de/wor...cks/menues.php

    allerdings halt net mit klick, sondern mouseover.... (find ich auch besser für a menü)
    >> die icq-schreiberlinge bitte dies hier beachten



    1679 entdeckte Gottfried Wilhelm Leibniz das Binärsystem, bei einem Gespräch mit seiner Mutter: "Ja..., Nein..., Nein..., Nein..., Ja..., Ja..., Nein..."

  3. #3
    Kaiser(in)
    Registriert seit
    24.04.2006
    Ort
    Ludwigshafen
    Beiträge
    2.720
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings

    Standard

    Evtl. ein CSS-Popup-Fenster?
    Funktionsweise siehe unter der im ersten Beitrag genannten Quelle.

  4. #4
    gast
    Gast

    Standard

    Zitat Zitat von driver
    also n dropdown findest hier:
    http://barrierefrei.e-workers.de/wor...cks/menues.php

    allerdings halt net mit klick, sondern mouseover.... (find ich auch besser für a menü)

    hi,
    ich hab grad ma versucht das erste Drop-Down Menü zu benutzen von deinem Link, wenn ich das in ein html-formular einfüge, funktioniert das voll nich...
    wenn ich das Formular (mit zb Mozilla FF) öffne steht die helfte des Codes da....
    woran liegt das...?

  5. #5
    Forum Guru Avatar von driver
    Registriert seit
    10.04.2006
    Alter
    34
    Beiträge
    20.729
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings

    Standard

    hast auch die css richtig eingebunden ?
    >> die icq-schreiberlinge bitte dies hier beachten



    1679 entdeckte Gottfried Wilhelm Leibniz das Binärsystem, bei einem Gespräch mit seiner Mutter: "Ja..., Nein..., Nein..., Nein..., Ja..., Ja..., Nein..."

  6. #6
    Gast

    Standard

    ++++++++++++++++++++++++++++++++++++++++++++++++++ +++++++++
    HTML
    Fuer die ungestylte Textversion sollten noch ein paar
    (ansonsten unsichtbare) Trennzeichen usw. eingebaut werden.
    ++++++++++++++++++++++++++++++++++++++++++++++++++ +++++++++

    <div id="menuebox">

    <div id="menue">
    <div class="aussen">
    <span class="menutag">Produkte</span>
    Systeme
    Speicher
    Laufwerke
    Monitore
    Drucker
    Zubehör
    </div>
    <div class="aussen">
    <span class="menutag">Leistungen</span>
    Netzwerke
    Server
    Wartung
    </div>
    <div class="aussen">
    <span class="menutag">Service</span>
    Reparatur
    Konfiguration
    Software
    Schulung
    </div>
    <div class="aussen">
    <span class="menutag">Links</span>
    About Us
    Partner
    Referenzen
    </div>
    </div>

    <!-- Der folgende Block bedient nur IEs!
    Durch diese Redundanz vermeiden wir den Einsatz von Javascript. -->

    <!--[if IE]>
    <div class="stupidie">
    <a class="auss" href="#"><span class="menutag">Produkte</span>
    <table><tr><td>
    Systeme
    Speicher
    Laufwerke
    Monitore
    Drucker
    Zubehör
    </td></tr></table>
    </a>
    <a class="auss" href="#"><span class="menutag">Leistungen</span>
    <table><tr><td>
    Netzwerke
    Server
    Wartung
    </td></tr></table>
    </a>
    <a class="auss" href="#"><span class="menutag">Service</span>
    <table><tr><td>
    Reparatur
    Konfiguration
    Software
    Schulung
    </td></tr></table>
    </a>
    <a class="auss" href="#"><span class="menutag">Links</span>
    <table><tr><td>
    About Us
    Partner
    Referenzen
    </td></tr></table>
    </a>
    </div>
    <![endif]-->

    </div>


    ++++++++++++++++++++
    CSS Teil I
    ++++++++++++++++++++

    /*
    Menue-styles fuer non-IEs
    Achtung:
    Fuer non-IEs gilt das Stylesheet 'dropdown.css'!
    Fuer IE gilt das Stylesheet 'fix-ie.css' (per CC)!
    */

    #menuebox {
    position: relative;
    height: 30px;
    }
    .stupidie {
    display: none;
    }
    #menue {
    position:absolute;
    top: 5px;
    left: 0;
    z-index: 200;
    }

    #menue .aussen {
    float: left;
    display: block;
    overflow: hidden;
    width: 8em;
    height: 1.3em;
    font-weight: bold;
    text-align: center;
    background-color: #dec79a;
    color: #513913;
    border: 1px solid;
    border-color: #d0843e #78561d #78561d #d0843e;
    }
    #menue .aussen:hover {
    height: auto;
    background-color: #624617;
    color: #fff;
    }

    a.innen-1 {
    margin-top: 2px;
    }
    a.innen,
    a.innen-1 {
    display: block;
    width: 7.9em;
    padding: 2px 0;
    text-decoration: none;
    font-weight: normal;
    border-bottom: 1px solid #78561d;
    background-color: #ecd8ae;
    color: #600;
    }
    a:visited.innen,
    a:visited.innen-1 {
    background-color: #ecd8ae;
    color:#555;
    }
    a:hover.innen,
    a:hover.innen-1 {
    background-color: #f7eedb;
    color: #900;
    }

    span.menutag {
    display: block;
    cursor: default;
    }


    ++++++++++++++++++++
    CSS Teil II
    ++++++++++++++++++++

    /*
    Menue-styles fuer IEs
    Am besten per Conditional Comment einbinden.
    Fuer IE5.5 und 5.0 muessen nur geringfuegige kosmetische
    Anpassungen vorgenommen werden (siehe Kommentare).
    */

    #menue {
    display:none;
    }
    .stupidie {
    display: block;
    position: absolute;
    top: 5px;
    left: 0;
    z-index: 200;
    }

    a.auss {
    float: left;
    width: 8em;
    height: 1.4em;
    overflow: hidden;
    display: block;
    font-weight: bold;
    text-align: center;
    text-decoration: none;
    background-color: #dec79a;
    color: #513913;
    border: 1px solid;
    border-color: #d0843e #78561d #78561d #d0843e;
    }
    a:hover.auss {
    overflow: visible;
    background-color: #624617;
    color: #fff;
    }
    a:hover.auss table {
    display: block;
    margin-top: 3px;
    background-color: #dec79a;
    color: #400;
    border-collapse: collapse;
    }

    a.inn {
    display: block;
    width: 7.9em; /* fuer 5er IEs anpassen, sonst 'zuckt' es */
    padding: 2px 0;
    font-size: 100%; /* fuer 5er IEs auf 80% reduzieren */
    font-weight: normal;
    text-align: center;
    text-decoration: none;
    border-bottom: 1px solid #78561d;
    background-color: #ecd8ae;
    color: #600;
    }
    a:visited.inn {
    background-color: #ecd8ae;
    color:#444;
    }
    a:hover.inn {
    position: relative;
    background-color: #f7eedb;
    color: #900;
    }
    span.menutag {
    display: block;
    cursor: default;
    }

    _______
    so, dass is der Code, was muss ich damit noch machen?

  7. #7
    Forum Guru Avatar von driver
    Registriert seit
    10.04.2006
    Alter
    34
    Beiträge
    20.729
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings

    Standard

    den html-teil in ne html-file schreiben.
    die css angaben entweder in den head einbinden
    oder in ne externe css-datei..
    >> die icq-schreiberlinge bitte dies hier beachten



    1679 entdeckte Gottfried Wilhelm Leibniz das Binärsystem, bei einem Gespräch mit seiner Mutter: "Ja..., Nein..., Nein..., Nein..., Ja..., Ja..., Nein..."

  8. #8
    Gast

    Standard

    also den html-teil in ein html-file....k, hab ich
    wie mach ich das mit der externen css-datei??
    (is wahrscheinlich ne blöde Frage, weiß ich aber leider grade echt nich )
    und wie muss ich die css datein nennen?
    thx

  9. #9
    Forum Guru Avatar von driver
    Registriert seit
    10.04.2006
    Alter
    34
    Beiträge
    20.729
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings

    Standard

    die datei nennste z.b. style.css (is im prinzip egal)

    und dann fügst in den head der html noch das ein:
    Code:
    <link rel="stylesheet" href="style.css" type="text/css"/>
    >> die icq-schreiberlinge bitte dies hier beachten



    1679 entdeckte Gottfried Wilhelm Leibniz das Binärsystem, bei einem Gespräch mit seiner Mutter: "Ja..., Nein..., Nein..., Nein..., Ja..., Ja..., Nein..."

  10. #10
    der/die Göttliche Avatar von jojo87
    Registriert seit
    23.03.2007
    Ort
    Leipzig
    Alter
    30
    Beiträge
    3.131
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings

    Standard

    den code in "dateiname.css" und dann im head-teil


    Code:
    <link rel="stylesheet" type="text/css" href="dateiname.css" />
    einfügen.

Ähnliche Themen

  1. DropDown mit CSS
    Von wernerdeluxe im Forum HTML & CSS Forum
    Antworten: 3
    Letzter Beitrag: 15.08.2008, 17:10
  2. Dropdown Menu geht nur im FF nicht
    Von minder im Forum HTML & CSS Forum
    Antworten: 2
    Letzter Beitrag: 05.07.2008, 16:43
  3. css js dropdown menü
    Von st0ny im Forum HTML & CSS Forum
    Antworten: 10
    Letzter Beitrag: 16.10.2007, 18:26
  4. Suche HTML-Code für Dropdown-Menü
    Von Dominikgt im Forum HTML & CSS Forum
    Antworten: 2
    Letzter Beitrag: 09.11.2006, 16:04
  5. Jscript zur Darstellung von linearem Menu in ein Baum Menu
    Von stud3 im Forum PHP Forum - Apache - CGI - Perl - JavaScript und Co.
    Antworten: 1
    Letzter Beitrag: 28.11.2004, 09:55

Stichworte

Berechtigungen

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