[caustics]

Hallo Leute,
ich bin neu beim Thema Typo3 - hab mich mal ein wenig durch Tutorials durchgekämpft und im Endeffekt tatsächlich eine funktionierende Page erstellen können.
Allerdings bin ich dabei auf ein Problem getroffen, dass ich bisher noch nicht lösen konnte - und weder google noch die Suche hier im Forum hat mich weitergebracht. So langsam verzweifle ich daran.

Meine Seite besteht aus einem Content Bereich, einer Navigation und 3 ins das Template reinprogrammierten Buttons - diese Buttons werden via CSS bei einem Hover der Mouse ausgetauscht. Zumindest in der Template-Vorlage.
Sobald ich aber eine Seite mit Typo3 daraus mache, funktioniert dieser Effekt nicht mehr.

Das Kuriose ist, dass alle anderen Angaben in der CSS (Hintergrundfarben, Div-Positionen u.ä.) komplett übernommen werden und richtig angezeigt werden. Schaut man sich den Sourcecode der generierten Seite an wird auch das CSS richtig eingebunden, und es fehlt auch keine Angabe.

Trotzdem wird eben der Hover-Effekt ignoriert.

Achja zum Browser - sowohl unter IE als auch unter FF funktioniert der Hovereffekt in der Vorlagen Datei, aber im fertigen Typo in keinem Browser.

Ich hoffe ihr könnt mir helfen... Danke schon mal fürs durchlesen des Problems.

gruß,
Dave

[Phlogiston]

Gib uns doch bitte beide Quelltexte, bzw. hast du die mal verglichen?

[caustics]

also, folgendes sind die DIVs auf denen der effekt liegt. (aus der typo3 Seite entnmmen)

<div class="headnav">
 <div class="unternehmenbutton">&nbsp;</div>
 <div class="kundenbutton">&nbsp;</div>
 <div class="shopsbutton">&nbsp;</div>
 </div>

hier der entsprechende CSS-Code.

.unternehmenbutton {
	width: 151px;
	height: 43px;
	background-image:url(../images/button_unternehmenhover.jpg);
	float: left;

}

.unternehmenbutton:hover {
	background-image:url(../images/button_unternehmen.jpg);

}


.kundenbutton {
	background-image:url(../images/button_portal.jpg);
	width: 151px;
	height: 43px;
	float: left;
	margin-left: 5px;

}

.kundenbutton:hover {
	background-image:url(../images/button_portalhover.jpg);
}

.shopsbutton {
	background-image:url(../images/button_shops.jpg);
	width: 151px;
	height: 43px;
	float: left;
	margin-left: 5px;
}

.shopsbutton:hover {
	background-image:url(../images/button_shopshover.jpg);
}

die CSS hab ich auch nochmal über ein includeCSS eingebunden (das hatte ich mal drin und mal draußen um es zu testen, gibt keinen Unterschied leider [nur das Typo ja noch den titel hinzufügt] - außer der dass dann das CSS zweimal gelinkt ist im der Datei:sad:

Typoscript-Code:

1: 2: 3: 4: 5: 6: 7: 8: 9: 10: 11: 12: 13: 14: 15: 16: 17: 18: 19: 20: 21: 22: 23: 24: 25: 26:

## Menu [Begin] lib.mainMenu = HMENU lib.mainMenu.entryLevel = 0 lib.mainMenu.1 = TMENU lib.mainMenu.1.NO { allWrap = |<br /> } ## Menu [End] config.spamProtectEmailAddresses = 1 page = PAGE page.typeNum = 0 page.10 = USER page.10.userFunc = tx_templavoila_pi1->main_page page.includeCSS{ file1 = fileadmin/templates/unternehmen/css/style.css file1 { title = MainStyle media = all } }

oder meintest du einen anderen Code?

[Denny1987]

Kannst du uns nicht einen Link zu deiner Seite geben ? Denn könnte man den Fehler wesentlich einfacher finden als jetzt. Oder erarbeitest du alles Lokal ?

[caustics]

klar

greem GmbH: greem GmbH

[Denny1987]

Gleich mal eine Anmerkung ein Menü macht man mit

PHP-Code:

<ul>
<li>Punkt1</li>
<li>Punkt2</li>
//usw
</ul> 


und nicht mit divs

du versuchst einen :hover auf ein DIV anzuwenden das unterstützt der IE 6 auf alle fälle nicht. Beim IE 7 bin ich mir da nicht so sicher

also wenn du das so machen würdest

PHP-Code:

<a href="#" class="kundenbutton"></a> 


denn geht es auch wieder

ich würde dir vorschlagen es so zu machen

PHP-Code:

<ul>
   <li><a href="#" class="kundenbutton"></a></li>
   //usw
</ul> 


[caustics]

hey,
danke erstmal für die tipps. Das ganze so zu lösen wie du vorgeschlagen hast wäre jetzt auch meine Notlösung gewesen.

Zu den DIVs - die ganze Seite soll komplett dem XHTML 1.0 Transitional Standard entsprechen, deshalb habe ich erstmal alles in DIVs angelegt.

Ich habe jetzt nochmal das Template in einen anderen Ordner hochgeladen, damit ihr euch das mal anschauen könnt.

greem GmbH - Unser Unternehmen

Auffällig ist auch, dass das Template im IE und FF fast komplett gleich aussieht, mit Typo unter IE das ganze aber komplett zerschossen ist...

[Denny1987]

Denn hast du den Sinn nicht so ganz verstanden Menüs macht man mit den dafür vorgesehen Elementen (ul ol) alles andere ist einfach murks. Das dein Template in Typo3 unter dem ie komisch aussieht kann es nur sein das der DocType vielleicht falsch gesetzt wurde ansonsten hast du beim Typo3 was falsch konfiguriert. Wenn das Grundtemplate local in Ordnung ist denn ist es auch in Typo3 in Ordnung.

[caustics]

Der Tipp mit dem DocType war GOLDRICHTIG.


Das hat auch das CSS-Problem gelöst. Super, vielen Dank.

[Denny1987]

Gut Gut aber vergesse denn bitte nicht den Thread als gelöst zu Markieren