Hvordan få til en enkel drop down link?

Eirikg89 · 26. januar 2005

Hvordan klarer jeg å lage ne link som når man holder pila på den så kommer det nye linker under? Bare sånn helt enkelt.

Marvil · 26. januar 2005

Her f.eks, ellers er Søkefunksjonen og Google undervurderte hjelpemidler her på forumet.

melli123 · 26. januar 2005

Denne er jo fin da

jeg vet ikke hvor flink du er med HTML og CSS jeg?

ihvertfall, her er linken: LINK

Eirikg89 · 27. januar 2005

Linkene oppfører seg ikke som linker.. Med en gang jeg putter på flere en to så blir det ikke drop down linker noen av dem. man bare holder pila på den men ingenting skjer?

Hva er feil i koden?

body {font-size:1%; color:#fff;} /*get rid of the IE bug that prints the the end of the !doctype */

.menu {display:none;}

.holder {color:#000; width:96px; height:18px; display:block; background:#dca; border:1px solid #000; margin-right:1px; text-align:center; float:left; text-decoration:none; font-family:tahoma, vardana, arial, sans-serif; font-size:10px; line-height:18px; overflow:hidden;}

.holder:hover {height:auto; cursor:pointer;color:#fff; background:#000;}

a.inner, a.inner:visited {display:block; width:95px; height:18px; border-bottom:1px solid #000; text-decoration:none; color:#000; background:#eee;}

a.inner:hover {background:#add;}

</style>

</head>

<body>

<a class="outer" href="page1.html">MENU 1

</td></tr></table>

</a>

<a class="outer" href="page1.html">MENU 2

</td></tr></table>

</a>

</div>

MENU 1<br />

</div>

MENU 2<br />

</div><div class="menu">

<a class="outer" href="page1.html">MENU 1

</td></tr></table>

</a>

<a class="outer" href="page1.html">MENU 2

</td></tr></table>

</a>

</div>

MENU 1<br />

</div>

MENU 2<br />

</div><div class="menu">

<a class="outer" href="page1.html">MENU 1

</td></tr></table>

</a>

<a class="outer" href="page1.html">MENU 2

</td></tr></table>

</a>

</div>

MENU 1<br />

</div>

MENU 2<br />

</div><div class="menu">

<a class="outer" href="page1.html">MENU 1

</td></tr></table>

</a>

</div>

MENU 1<br />

</div>

</body>

Endret 27. januar 2005 av Eirikg89

NisseMannH4X · 27. januar 2005

Tok meg ikke tid til å lese igjennom den koden din der, men har en super dropdown sak med en god css fil:

html:

<ul id=nav>
 <li>Link 1
   <ul>
     <li><a href="">Sub 1</a></li>
     <li><a href="">Sub 2</a></li>
     <li><a href="">Sub 3</a></li>
     <li><a href="">Sub 4</a></li>
 </ul>
</li>

 <li>Link 2
   <ul>
     <li><a href="">Sub 1</a></li>
     <li><a href="">Sub 2</a></li>
     <li><a href="">Sub 3</a></li>
     <li><a href="">Sub 4</a></li>
 </ul>
</li>

CSS:

ul {
list-style: none;
padding: 0;
margin: 0;
}

#nav a {
font-weight: bold;
color: FFFFFF;
}

#nav a {
text-decoration: none;
}

#nav li li a {
display: block;
font-weight: normal;
background: #C3E5FE;
color: white;
padding: 0.2em 10px;
}


#nav li li a:hover {
padding: 0.2em 10px;
background: #FFFFFF;
color: #C3E5FE;
}

li {
float: left;
position: relative;
margin-top: 4px;
width: 7em;
text-align: center;
cursor: default;
font-family: "Verdana";
font-size: 11px;
color: white;
font-weight: bold;
text-transform: uppercase;
}


li ul {
display: none;
position: absolute;
top: 100%;
left: 0;
font-weight: normal;
background-color: #C3E5FE;
padding: 0.5em 0 1em 0;
border-right: solid 1px #98D2FC;
border-left: solid 1px #98D2FC;
border-top: solid 1px #98D2FC;
border-bottom: solid 1px #98D2FC;
}

li>ul {
top: auto;
left: auto;
}

li li {display: block;
float: none;
background-color: transparent;
border: 0;
}

li:hover ul, li.over ul {
display: block;
}

Dett fungerer!

Eirikg89 · 27. januar 2005

Vil bruke det jeg har!

Denne koden bruker man når det bare er to drop downs(den fungerer fint)

body {font-size:1%; color:#fff;} /*get rid of the IE bug that prints the the end of the !doctype */

.menu {display:none;}

.holder {color:#000; width:90px; height:18px; display:block; background:#dca; border:1px solid #000; margin-right:1px; text-align:center; float:left; text-decoration:none; font-family:tahoma, vardana, arial, sans-serif; font-size:10px; line-height:18px; overflow:hidden;}

.holder:hover {height:auto; cursor:pointer;color:#fff; background:#000;}

a.inner, a.inner:visited {display:block; width:89px; height:18px; border-bottom:1px solid #000; text-decoration:none; color:#000; background:#eee;}

a.inner:hover {background:#add;}

</style>

<a class="outer" href="page1.html">MENU 1

</td></tr></table>

</a>

<a class="outer" href="page1.html">MENU 2

</td></tr></table>

</a>

</div>

MENU 1<br />

</div>

MENU 2<br />

</div>

Hvilken kode skal jeg da bruke hvis jeg skal ha 7 slike?(ikke to)???

NisseMannH4X · 27. januar 2005

ja, posta den som et eksempel på det du spurte om i topic!

Logg inn

Hvordan få til en enkel drop down link?

Anbefalte innlegg

Eirikg89

Lenke til kommentar

Videoannonse

Marvil

Lenke til kommentar

melli123

Lenke til kommentar

Eirikg89

Lenke til kommentar

NisseMannH4X

Lenke til kommentar

Eirikg89

Lenke til kommentar

NisseMannH4X

Lenke til kommentar

Opprett en konto eller logg inn for å kommentere

Opprett konto

Logg inn

Populær nå

Hvilket strømselskap har du og hvorfor? 1 2

Hvem er aktive 0 medlemmer