Hallo!
Ich wollte ein Web auf Typo3 umstellen.
In diesem Web verwende ich 2 *.htc Dateien, damit man die Seite auch im IE6 betrachten kann. Diese ermöglichen die Alphatransparenz von PNGs sowie den Hover-Effekt für mein Pulldown-Menü.
Außerhalb von Typo3 funktioniert das Web, offline und online.
Nun meine Frage, wie binde ich diese HTC Dateien richtig in Typo3 ein?
Mache ich es wie bisher d. h.:
für die Transparenz:
in meiner CSS
body { behavior:url("ie6_fix.htc"); }
ie6_fix.htc liegt im selben verzeichnis wie das HTML-Template meiner Seite
und für das Menü:
headerData.50 = TEXT
headerData.50.value = <!--[if lte IE 6]><style type="text/css" media="screen">body { behavior:url("csshover.htc"); }</style><![endif]-->
csshover.htc liegt im selben verzeichnis wie das HTML-Template meiner Seite
Leider funktioniert nichts davon. Muss ich etwas besonderes beachten?
Vielen Dank schonmal
gruß Flo
In diesem Web verwende ich ...
Was ist denn ein Web #paralyzed#
Also für die Sachen, die Du anstellen möchtest, benötigst du nicht notwendigerweise .htc-Dateien. Das geht auch auf anderen Wegen. Egal.
Vielleicht findest du hier Anregungen:
http://www.twinhelix.com/css/iepngfix/demo/
ie6_fix.htc liegt im selben verzeichnis wie das HTML-Template meiner Seite
So wie du es in deinem CSS definierst ist es vor allem wichtig, dass sich die .htc-Datei im gleichen Verzeichnis befindet wie deine CSS-Datei.
Ok dann mal ganz von vorne... als WEB bezeichne ich den Internetauftritt eines Kunden.
D.h. alle notwendigen Dateien sowie deren Struktur, die benötigt werden um die Internetseite sauber darzustellen, damit meine ich images, scripte, css-Dateien, etc.
Alles klar?
Diese "Konstrukt" funtioniert bei mir bereits ohne Typo3, d.h. die Pfade der htc, css und html Dateien sind alle aufeinander abgestimmt und die Dateien "finden sich gegenseitig" #paralyzed#
Übernehmen ich diese Struktur/Pfade, in meine Typo3web funktioniert es allerdings nicht mehr. Daher wollte ich wissen, ob typo3 vielleicht ein Problem mit der verarbeitung von htc-dateien hat, oder ob ich bei den Pfaden zusätzlich etwas beachten muss.
Hast du noch weitere Tipps?
Der Begriff "Web" ist da vielleicht zu groß gewählt:
http://de.wikipedia.org/wiki/Web
Den Internetauftritt deines Kunden kannst du als "Website" bezeichnen. Dann weiß jeder, dass es sich um das gesamte Projekt (Dateien, CMS, Struktur, etc) handelt:
http://de.wikipedia.org/wiki/Website
Im Prinzip sollte es in deiner TYPO3-Umgebung auch funktionieren, wenn du es bereits außerhalb davon erfolgreich testen konntest. Überprüfe trotzdem nochmal alle Pfade!
Vielleicht gibt es aber auch ein Problem mit dem Zeichensatz? Siehe:
#78223
Ok,ok geb mich geschlagen... :o
Ich werd die Pfade nochmal überprüfen und eventuell mit absoluten arbeiten, dann sollte es ja eigentlich funktionieren.
Ich hoffe mal nicht, dass es am Zeichensatz liegt, da ich in dem von dir genannten thread keine Lösung des Problems finden kann.
ICh melde mich hier nochmal und sag dir meine Ergebnise. Nebenbei, kennst du eine alternative, wie ich das Menu auch ohne htc Datei IE6 kompatible bekomme?
ALso ich weiß nicht weiter, die Pfade stimmen, hab es sogar mit absoluten Pfaden versucht. Es klappt nicht!
Die Pfade sind ok, habs sogar mit absoluten versucht.
Hier meine Bedingung für den IE6 im TS des Roottemplates:
headerData.5 = TEXT
headerData.5 {
value (
<!--[if IE 6]>
<style type="text/css" media="screen">body { behavior:url("http://www.meineDomain.de/typo3/fileadmin/templatedaten/css/csshover.htc"); }</style>
<![endif]-->
)
}
Ich weiß n9icht mehr weiter es funktioniert einfach nicht.
Weißt du eine alternative zu einem funktionmierendem Dropdown Menu?
Weißt du eine alternative zu einem funktionmierendem Dropdown Menu?
Eine Alternative wäre ein nicht funktionierendes Dropdown Menu.
Derartige Menüs lassen sich schon seit geraumer Zeit problemlos ohne Verwendung von Scripten bewerkstelligen. Im Einzelfall kommt es natürlich darauf an (hat mein Jura-Prof immer gesagt 🙂
Du brauchst nur HTML und CSS. Suche in Google nach "CSS Dropdown Menu" und dir springen die Dinger nur um die Ohren.
Eine Alternative wäre ein nicht funktionierendes Dropdown Menu.
Siehste, ich dreh langsam durch, dass kann doch wohl nicht so schwer sein...
Ich meinte natürlich ein anderes Menu, welches Moz, IE 7 und IE 6 konform ist.
Hab inzwischen fast den ganzen Tag damit versemmelt.
fileadmin/templatedaten/css/csshover.htc
so reicht das zum einbinden von dateien
also schätze mal du baust ein grafikmenu also mit grafikbuttons
alternative ist ein GMENU_LAYERS oder versuchst es ohne das hin zu bekommen mit GMENU
GMENU_LAYERS haut dir viel js in den head bereich
gute beschreibung findest in der TSREF
oder was mir noch eingefallen ist schau dir das mal an
http://82.165.8.199/typo3cms/exotec-design.de/index.php?id=90
bzw. das
http://82.165.8.199/typo3cms/exotec-design.de/index.php?id=89
Nee, leider nicht.
Ich verwende ein ganz normales TMENU.
Es liegt wohl doch an unserem Server, ich hab in einer Testumgebung herausgefunden, dass auch außerhalb von Typo3 die HTC-Dateien nicht bzw. nicht richtig verarbeitet werden.
Ich hab es inzwischen geschafft mit meinen begrenzten Typo3 kenntissen, das "cross-browser pull-up cascading validating menu" von stu nicholls mit TypoScript zu generieren.
http://www.cssplay.co.uk/menus/upmenu.html
Im IE 6 und FF funktioniert es nun, doch jetzt macht der IE 7 Probleme!?!
Habt Ihr vielleicht eine Idee woran es liegen könnte?
Hier mein TS:
###### Footermenu #######
lib.footer_navi = HMENU
lib.footer_navi {
special = directory
special.value = 5
wrap = <div class="menu"> | </div>
### Erste Ebene ###
1 = TMENU
1 {
wrap = <ul>|</ul><!--[if lte IE 6]></td></tr></table></a><![endif]-->
expAll = 1
NO.wrapItemAndSub = <li> | </li>
NO.allWrap = | <!--<![endif]--><!--[if lte IE 6]><table><tr><td><![endif]-->
NO.linkWrap = |<!--[if IE 7]><!-->
NO.ATagBeforeWrap = 1
ACT < .NO
ACT = 1
IFSUB = 1
IFSUB {
wrapItemAndSub = <li> | </li>
allWrap = | <!--<![endif]--><!--[if lte IE 6]><table><tr><td><![endif]-->
linkWrap = |<!--[if IE 7]><!-->
ATagParams = class="drop"
ATagBeforeWrap = 1
}
}
### Zweite Ebene ###
2 = TMENU
2 {
wrap = <ul>|</ul><!--[if lte IE 6]></td></tr></table></a><![endif]-->
NO.allWrap = <li>|</li>
}
}
Und hier die css von cssplay.co.uk dazu:
#info h3 {margin-bottom:200px;}
/* style the outer div to give it width */
.menu {
width:750px;
height:30px;
font-size:0.85em;
}
/* remove all the bullets, borders and padding from the default list styling */
.menu ul {
padding:0;
margin:0;
list-style-type:none;
}
.menu ul ul {
width:150px;
}
/* float the list to make it horizontal and a relative positon so that you can control the dropdown menu positon */
.menu li {
float:left;
width:150px;
position:relative;
}
/* style the links for the top level */
.menu a, .menu a:visited {
display:block;
font-size:11px;
text-decoration:none;
color:#fff;
width:139px;
height:30px;
border:1px solid #fff;
border-width:1px 1px 0 0;
background:#758279;
padding-left:10px;
line-height:29px;
}
/* a hack so that IE5.5 faulty box model is corrected */
* html .menu a, * html .menu a:visited {
width:150px;
w\idth:139px;
}
/* style the second level background */
.menu ul ul a.drop, .menu ul ul a.drop:visited {
background:#949e7c;
}
/* style the second level hover */
.menu ul ul a.drop:hover {
background:#c9ba65;
}
.menu ul ul :hover > a.drop {
background:#c9ba65;
}
/* style the third level background */
.menu ul ul ul a, .menu ul ul ul a:visited {
background:#e2dfa8;
}
/* style the third level hover */
.menu ul ul ul a:hover{
background:#b2ab9b;
}
.menu ul ul ul :hover > a {
background:#b2ab9b;
}
/* style the table so that it takes no part in the layout - required for IE to work */
.menu table {border-collapse:collapse; border:0; position:absolute; left:0; bottom:-1px;}
/* hide the sub levels and give them a positon absolute so that they take up no room */
.menu ul ul {
visibility:hidden;
position:absolute;
bottom:31px;
left:0;
width:150px;
}
* html .menu ul ul {
bottom:30px;
}
/* position the third level flyout menu */
.menu ul ul ul{
left:150px;
bottom:0;
width:150px;
}
/* position the third level flyout menu for a left flyout */
.menu ul ul ul.left {
left:-150px;
}
/* style the second level links */
.menu ul ul a, .menu ul ul a:visited {
background:#d4d8bd;
color:#000;
height:auto;
line-height:1em;
padding:5px 10px;
width:129px
/* yet another hack for IE5.5 */
}
* html .menu ul ul a{
width:150px;
w\idth:129px;
}
/* style the top level hover */
.menu a:hover, .menu ul ul a:hover{
color:#fff;
background:#949e7c;
}
.menu :hover > a, .menu ul ul :hover > a {
color:#fff;
background:#949e7c;
}
/* make the second level visible when hover on first level list OR link */
.menu ul li:hover ul,
.menu ul a:hover ul{
visibility:visible;
height:auto;
}
/* keep the third level hidden when you hover on first level list OR link */
.menu ul :hover ul ul{
display:none;
}
/* keep the fourth level hidden when you hover on second level list OR link */
.menu ul :hover ul :hover ul ul{
display:none;
}
/* make the third level visible when you hover over second level list OR link */
.menu ul :hover ul :hover ul{
display:block;
bottom:0;
}
/* make the fourth level visible when you hover over third level list OR link */
.menu ul :hover ul :hover ul :hover ul {
display:block;
bottom:0;
}
Vielleicht könnt ihr das ganze mal wenn ihr zeit habt, bei euch testen.
Ich wär echt dankbar, es kann nichts gravierendes mehr falsch sein.
Wie gesagt, der durch TS generierte Quelltext ist jetzt identisch mit dem des Menus von http://www.cssplay.co.uk/menus/upmenu.html.