Rollover TMENU

auch auf die Gefahr hin, daß ich angepflaumt werde wegen eines Doppenpostings bei Typo3forum.net http://www.typo3forum.net/forum/html-css/19678-hintergrundbild-groesse-uebernehmen.html#post58799

Ich habe in Typo ein TMENU gebaut. Funktioniert auch soweit. Nun möchte ich das ganze mit CSS formatieren. Der betreffende Typoscript-Teil sieht so aus:

page = PAGE
page.includeCSS.file= fileadmin/css/jw_calendar.css
page{
	typeNum = 0
	bodyTag = <body bgColor="#FFFFFF">
	stylesheet = fileadmin/css/styles.css
	
	10=TEMPLATE
	10.template = FILE
	10.template.file = fileadmin/templates/content.html
	10.workOnSubpart = DOCUMENT_BODY
	10.marks{
	
	
	TOP1=IMAGE
	TOP1.file = fileadmin/images/setup/top1.jpg
	
	TOP2=IMAGE
	TOP2.file = fileadmin/images/setup/top2.jpg
	
	
	
	
	
	INHALT < styles.content.get
	INHALT.select.where = colPos = 0
	INHALT.stdWrap.required = 1
	INHALT.stdWrap = |
	
	NEWS < styles.content.get
	NEWS.select.where = colPos = 1
	NEWS.stdWrap.required = 1
	NEWS.stdWrap = |
	
	DOWNLOADS < styles.content.get
	DOWNLOADS.select.where = colPos = 2
	DOWNLOADS.stdWrap.required = 1
	DOWNLOADS.stdWrap = |
	
	# ***MAINMENUE***
		MAINMENUE = HMENU
		MAINMENUE.special = directory
		MAINMENUE.special.value = 6
		MAINMENUE.entryLevel = 0
		MAINMENUE.1 = TMENU
		MAINMENUE.1{
			NO.allWrap = <div class="navi_level1">&nbsp;&#124;&nbsp;|</div>
			}
		
		MAINMENUE.2 = TMENU
		MAINMENUE.2{
			NO.allWrap = <div class="navi_level2">&nbsp;&#124;&nbsp;|</div>
			}
	

}

und hier das CSS dazu

.navi_level1{
	background-image: url(menuback.gif);
	background-repeat: no-repeat;
}

.navi_level1 a:hover{
	font-size:small;
	text-decoration:none;
	color: red;
	background-image: url(menuback_over.gif);
	background-color : #CCCCCC;
	font-family: Verdana, Arial, Helvetica, sans-serif;
}

.navi_level1 a:link{
	font-size:small;
	text-decoration:none;
	color: black;
	font-family: Verdana, Arial, Helvetica, sans-serif;
}

.navi_level1 a:visited{
	font-size:small;
	text-decoration:none;
	color:black;
	font-family: Verdana, Arial, Helvetica, sans-serif;
}

.navi_level2 a:hover{
	font-size: x-small;
	text-decoration:none;
	color: Red;
	background-color : #999999;
	background-image: url(menuback_over.gif);
	padding-left : 25px;
	font-family: Verdana, Arial, Helvetica, sans-serif;
}

.navi_level2 a:link{
	font-size:x-small;
	text-decoration:none;
	color: black;
	padding-left : 25px;
	font-family: Verdana, Arial, Helvetica, sans-serif;
}

.navi_level2 a:visited{
	font-size: x-small;
	text-decoration:none;
	color:black;
	padding-left : 25px;
	font-family: Verdana, Arial, Helvetica, sans-serif;
}

Mein Problem ist das ich ein funktionierende Rollover im Menü mit Hintergrundsbildwechsel haben möchte..

Kann mir einer helfen?[/url]

Hallo,

bitte nächste mal nur das TS posten, das auch relevant ist, spart einem das scrollen 😉

Schmeiss bei ".navi_level1{ ... " das Hintergrundbild raus und füg es nur da ein:

.navi_level1 a, .navi_level1 a:link, .navi_level1 a:visited, .navi_level1 a:active {
background: url(normal.jpg) no-repeat;
}
.navi_level1 a:hover {
background: url(ro.jpg) no-repeat;
}

lg georg
PS: typo3forum.net ist keine Konkurrenz, 2 Foren können sich um mehr Leute kümmern als 1

Danke... hat soweit geklappt.
Wie kann ich es lösen, dass das Hintergrundbild die größe meiner Menüpunkte bestimmt?

gar nicht!
das hindergrundbild nimmt den platz den es bekommt, also musst du den a-tag größer machen

georg

wie bekomme ich das in diesem Menü gelöst? Über rein-wrapen eines Tables?

ui bitte doch keine tabellen!

.navi_level1 a, .navi_level1 a:link, .navi_level1 a:visited, .navi_level1 a:active {
background: url(normal.jpg) no-repeat;
padding:5px 10px;
}

oder mit einer height:40px;

georg