• Das Erstellen neuer Accounts wurde ausgesetzt. Bei berechtigtem Interesse bitte Kontaktaufnahme über die üblichen Wege. Beste Grüße der Admin

suche pulldown ohne li bereich!

G

Gamer20

New member
ich finde nur pulldown menus mit per <li>!

gibt es ein script bzw. tutorial, mitdem ich ein pulldownmenu per tabelle machen kann? denn dann kann ich grafisch mehr machen (bild als hintergrund in die jeweilige zelle einbauen).

facht erst an eine aufklappbare tabelle, aber da rutscht der rest der HP ja immer ein stück runter, is ja auch lästig.
 
Du kannst auch bei <li> hintergrundgrafiken einbauen:

PHP: 
<ul>
<li style="background-image:url(dein_Bild) "><a href="#">link</a></li>
<li style="background-image:url(dein_Bild) "><a href="#">link</a></li>
<li style="background-image:url(dein_Bild.gif) "><a href="#">link</a></li>
<li style="background-image:url(dein_Bild.gif) "><a href="#">link</a></li>
</ul>

als beispiel gibts auch da noch was:
Stu Nicholls | CSSplay | An IE CSS only flyout menu using graphics

auch das verwendet grafiken:
Stu Nicholls | CSSplay | Arop down artist menu
 
Einfach aus dem Quelltext holen
Code: 
<div id="menu">
<dl id="gallery">
	<dt>Art Gallery</dt>

	<dd><a href="#" title="Paul Cezanne">Paul Cezanne</a></dd>
	<dd><a href="#" title="Henri Matisse">Henri Matisse</a></dd>
	<dd><a href="#" title="Vincent van Gogh">Vincent van Gogh</a></dd>
	<dd><a href="#" title="William Turner">William Turner</a></dd>
	<dd><a href="#" title="John Constable">John Constable</a></dd>
	<dd><a href="#" title="Claude Monet">Claude Monet</a></dd>

</dl>
</div>
Code: 
#menu dl {
background:#6699CC url(bottom.gif) no-repeat scroll left bottom;
margin:0pt auto;
padding:0pt 0pt 10px;
width:150px;
}
#menu dt {
background:#6699CC url(top.gif) no-repeat scroll left top;
border-bottom:1px solid #FFFFFF;
color:#FFFFFF;
font-size:1.4em;
font-weight:bold;
margin:0pt;
padding:10px;
}
#menu dd {
background:#4477AA none repeat scroll 0%;
border-bottom:1px solid #FFFFFF;
color:#FFFFFF;
font-size:1em;
margin:0pt;
padding:0pt;
}
#gallery a, #gallery a:visited {
background:#4477AA url(arrow.gif) no-repeat scroll 10px;
color:#FFFFFF;
display:block;
padding:5px 5px 5px 20px;
text-decoration:none;
width:125px;
}
#gallery a:hover {
background:#225588 url(arrowr.gif) no-repeat scroll 11px 10px;
color:#99CCFF;
}
ol li {
font-size:11px;
}
 
Zuletzt bearbeitet von einem Moderator:
Hi Slosd ! Super vielen Dank !!!
Ich habe auch versucht den Code aus der Seite zu kopieren. Aber ich habe ihn wohl übersehen.

Wie hast Du ihn gefunden ? Ich habe nach den Menü Einträgen geschaut.
 
Ich hab die Erweiterung "FireBug" für Firefox. Da bekomme ich unter anderem alle Stylesheets aufgelistet und angezeigt.
Im Quelltext ist das Zeugs als letztes Element im <head> zu finden.
 
Du musst dich einloggen oder registrieren, um hier zu antworten.
Zurück
Oben