Hallo,
ich würd gern mein Menü mit ypslideoutmenu machen und hab bisher des auch am Laufen, nur bisher hatte ich es mit css so gelöst, dass wenn man über den Menüpunkt gefahren ist, sich die Hintergrundfarbe geändert hat und dass wenn man drauf klickt dann die Farbe konstant blieb.
Möchte nun aber gerne eine Grafik hinter dem Meüpunkt haben, im Prinzip des gleiche Prinzip.
Also wenn des Meü normal ist, haben alle Menüpunkte die gleiche Grafik hinterlegt, hab ich doch dann einen Menüpunkt "überfahren" oder ihn angeklickt, zeigt es mir eine Grafik "menügeklickt" an.
Mit was geht sowas?
Nicht mit css oder?
Denn ich hatte es mit allen möglichen css "befehlen" probiert.
hab background:,background-image:, background-image:url(uploads/tf/button.jpg);background-position: center center;background-repeat: no-repeat ausprobiert, aber irgendwie hinterlegt keiner dieser befehle in meinem menü eine grafik.
und noch ne frage kann man des auch so machen, dass man eine "Standardgröße" hat für des Hintergrundbild und wenn der Menüpunkt aber größer wird, dass dann auch des hintergrundbild sich "verzerrt/vergrößert"?
Und wie is des ganze am besten so machbar, dass es in Netscape und IE gleich aussieht.
Würde gern ein Menü machen des wie folgt aussieht.
Also soll dreispaltige Tabelle seien.
In der Linken ebene soll der aktuell ausgewählte Menüpunkt des Hauptmenüs angezeigt werden und auch die gleiche Hintergrundgrafik wie des Menü haben und dann kommt in der zweiten Spalte das Hauptmenü und dort soll eben bei Mouseover des Bild wechseln und dann in der dritten Spalte soll wieder mit dem "normalen Buttonbild" der Menüpunkt Sitemap hinterlegt werden.
Danke schon mal für eure Hilfe.
Lg
also hatte eben gedacht des würde mit css so gehen:
#menue a
{
background-image:url(uploads/tf/button.jpg);
background-position: top center;
background-repeat: no-repeat;
font-family:Century Gothic,Verdana, Arial, Helvetica, sans-serif;
font-size:12px;
color:#FFFFFF;
padding-top:2px;
padding-right:2px;
padding-left:2px;
padding-bottom:2px;
margin:0 4px;
width:100px;
text-decoration:none;
border-bottom:5px ;
text-align=center;
height:20px;
}
#menue div
{
display:inline;
}
#menue a:link; #menue a:visited
{
font-family:Century Gothic,Verdana, Arial, Helvetica, sans-serif;
font-size:12px;
color:#789344;
background-color:#FFFFFF;
text-decoration:none;
}
#menue a:hover
{
font-family:Century Gothic,Verdana, Arial, Helvetica, sans-serif;
font-size:12px;
color:#789344;
background-image:url(uploads/tf/buttongedrueckt.jpg);
background-position: top center;
background-repeat: no-repeat;
text-decoration:none;
}
#menue a#current
{
font-family:Century Gothic,Verdana, Arial, Helvetica, sans-serif;
font-size:12px;
color:#789344;
background-image:url(uploads/tf/buttongedrueckt.jpg);
background-position: top center;
background-repeat: no-repeat;
text-decoration:none;
}
aber irgendwie zeigt der nun keine bilder an.
jemand ne idee?
lg
hier noch mein typoscript was ich bisher hab.
page = PAGE
# RealURL aktivieren
config.simulateStaticDocuments = 0
config.baseURL = http://www.ulf-konzept.de/
config.tx_realurl_enable = 1
config.prefixLocalAnchors = all
[browser = msie] && [version = < 7.0]
config.doctypeSwitch = 1
[global]
page.stylesheet = uploads/tf/main.css
page.bodyTag = <body bgcolor="000000">
page.10 = TEMPLATE
page.10 {
template = FILE
template.file = uploads/tf/template.html
workOnSubpart = DOCUMENT_BODY
}
tmp.NAVIGATION = HMENU
tmp.NAVIGATION {
#menue
wrap = <div id="menue" >| </div>
div_id_layer = yymenu
1 = tx_menu_ypslideoutmenu
1 {
expAll = 1
wrap = <ul> | </ul>
NO = 1
NO.wrapItemAndSub = <li>| </li>
ACT = 1
ACT < .NO
ACT.ATagParams = id=current
}
2 = tx_menu_ypslideoutmenu
2 {
moveTo = down
height = 22
width = 177
expAll=1
NO {
}
}
3 < .2
3.moveTo = right
3.width= 177
}
page.10.subparts.NAVI<tmp.NAVIGATION
page.10.subparts.INHALT_MITTE < styles.content.get
page.10.subparts.TOPIC=TEXT
page.10.subparts.TOPIC.data=field:title
hab nun rausgefunden, dass des problem einfach war, dass ich die bilder wenn ich
background-image:url(...);
komplett mit der ganzen url also http://www.seite/uploads/tf/...
bennen muß.
nun wird alles angezeigt und des gleiche muß man natürlich im css für des ypslideoutmenu auch machen.
lg