zurück zur Startseite
  


Zurück XHTMLforum > (X)HTML und CSS > (X)HTML
Seite neu laden Css navi problem IE 6 HILFE....

Antwort
 
LinkBack Themen-Optionen Ansicht
  #1 (permalink)  
Alt 27.10.2007, 12:36
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 27.10.2007
Beiträge: 5
slave befindet sich auf einem aufstrebenden Ast
Standard Css navi problem IE 6 HILFE....

Hallo erst mal liebe gemeinde
bin noch nicht so fit was css angeht

also ich habe mir eine kleine navi gebaut in css, in allen aktuellen brauser funkt. diese nur in dem IE6 nicht WARUM ! ich krieg die kriese bitte helft mir !
hier der code !

wißt ihr ich will einfach nur das man mit der maus über einen link fährt
und das dann darunter ein erklärender text steht mehr nicht !
wie gesagt IE7 Firefox etc da funkt es nur IE6 nicht bitte helft mir

vielen dank

der doctype:
Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml">
die css:
Code:
#znavi { 
white-space:nowrap; 
    width:1px; 
    height:45px; 
} 

#znavi #hide1, #hide2, #hide3, #hide4, #hide5, #hide6 { 
display:none; 
/*visibility:hidden;*/ 

} 

#znavi:hover #hide1, #znavi:hover #hide2, #znavi:hover #hide3, #znavi:hover #hide4, #znavi:hover #hide5, #znavi:hover #hide6    { 
    display:block; 
    /*visibility:visible;*/ 
    width:400px; 
    font-family: Geneva, Arial, Helvetica, sans-serif; 
    font-size: 15px; 
    color: #8A8A8A; 
    font-weight: bold; 
    font-style: italic; 
    height:45px; 
}
die boxen:
Code:
<div id="znavi" > 
<a href="grosse-zaubershow.php" class="navi">Große Zaubershow</a><br> 
<div id="hide1">Für Kinder von 8 bis 99 jahren</div> 
</div> 
<div id="znavi" style=" margin-left:45px;"> 
<a href="kinder-zaubershow.php" class="navi">Kinder Zaubershow</a> 
<div id="hide2">Für Kinder von 3 bis 10 jahren</div> 
</div> 
<div id="znavi" style=" margin-left:75px;"> 
<a href="weihnachtszauber.php" class="navi">Weihnachtszauber</a> 
<div id="hide3">Zauberhaftes zur Vorweihnachtszeit</div> 
</div> 
<div id="znavi" style=" margin-left:80px"> 
<a href="kinder-zaubershow-tagesaktion.php" class="navi">Kinder- Zaubershow als Tagesaktion</a> 
<div id="hide4">6 Stunden Non - Stop - Animation</div> 
</div> 
<div id="znavi" style=" margin-left:45px;"> 
<a href="luftballon-figuren.php" class="navi">Luftballon - Figuren</a> 
<div id="hide5">Zum Staunen und Mitmachen</div> 
</div> 
<div id="znavi"> 
<a href="gebaerdendolmetscher.php" class="navi">Geb&auml;rdendolmetscher</a> 
<div id="hide6">Für hörgeschädigte Kinder</div>
Mit Zitat antworten
Sponsored Links
  #2 (permalink)  
Alt 27.10.2007, 13:00
Benutzerbild von Crizzo
der mit dem Editor kämpft
XHTMLforum-Kenner
 
Registriert seit: 17.10.2006
Ort: Ost-Hessen
Beiträge: 4.829
Crizzo ist ein sehr geschätzer MenschCrizzo ist ein sehr geschätzer MenschCrizzo ist ein sehr geschätzer MenschCrizzo ist ein sehr geschätzer Mensch
Standard

SO (!) macht man das nicht.
Erst einmal muss die Navigation in eine Liste, da es eine Aufzählung ist.
Ungefähr so:
Code:
<ul id="navi">
<li><a href="grosse-zaubershow.php" class="navi">Große Zaubershow</a></li>
<li><a href="kinder-zaubershow.php" class="navi">Kinder Zaubershow</a> </li>
</ul>
Jetzt fügst du den Text ein, der beim "Über-den-Link-fahren" kurz "a:hover" angezeigt wird.
Code:
<ul>
<li>
<a href="grosse-zaubershow.php" class="navi">
<span>Für Kinder von 8 bis 99 Jahren.</span>
Große Zaubershow</a></li>
<li>
<a href="kinder-zaubershow.php" class="navi">
<span>Für Kinder von 3 bis 10 jahren</span>
Kinder Zaubershow</a> </li>
</ul>
Nun musst noch das Aussehen in CSS bestimmen und ganz wichtig den "span" verstecken, wenn man nicht über den Link fährt.
Sieht dann so in der CSS Datei aus:
Code:
ul#navi li a span {display:none;} /* Ohne "hover" ist "span" ausgeblendet */

ul#navi li a:hover span {display:block;
width: 400px;
} /* Bei "a:hover" wird es eingeblendet. */
Am einfachsten kannst du den "span" dann per position:absolute relativ zum Elternelement positionieren, dieses muss dann "position:relative" besitzen. Dazu mehr: Cascading Style Sheets { Vollreferenz zu CSS 1 und CSS 2.1 : POSITION }
__________________
Ohne Quelltext gibts selten Hilfe. Also: Onlinebeispiel hochladen und Link bereitstellen!
Foren-FAQ
Mit Zitat antworten
Sponsored Links
  #3 (permalink)  
Alt 27.10.2007, 16:57
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 27.10.2007
Beiträge: 5
slave befindet sich auf einem aufstrebenden Ast
Standard

hallo blackhawk
vielen dank erst mal für deine antwort
habe ich gleich ausprobiert aber leider habe ich das gleiche problem wie vorher
im IE6 funktioniert das nicht :O( in allen anderen ja
was ist falsch ich weiß nicht mehr weiter !!!
Mit Zitat antworten
  #4 (permalink)  
Alt 27.10.2007, 20:05
Benutzerbild von Crizzo
der mit dem Editor kämpft
XHTMLforum-Kenner
 
Registriert seit: 17.10.2006
Ort: Ost-Hessen
Beiträge: 4.829
Crizzo ist ein sehr geschätzer MenschCrizzo ist ein sehr geschätzer MenschCrizzo ist ein sehr geschätzer MenschCrizzo ist ein sehr geschätzer Mensch
Standard

Poste bitte genau DEINEN Code! Bei mir geht diese Version im IE5-7 einwandfrei.
__________________
Ohne Quelltext gibts selten Hilfe. Also: Onlinebeispiel hochladen und Link bereitstellen!
Foren-FAQ
Mit Zitat antworten
  #5 (permalink)  
Alt 27.10.2007, 21:44
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 27.10.2007
Beiträge: 5
slave befindet sich auf einem aufstrebenden Ast
Standard

super vielen dank das du mir helfen willst , den ich weiß nicht weiter
könnte es vieleicht auch am doctype liegen ?
naja das überlaß ich wohl lieber einen profie
hier der code..

Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Unbenanntes Dokument</title>
<style type="text/css">
<!--
ul#navi li a span {
display:none;
} /* Ohne "hover" ist "span" ausgeblendet */

ul#navi li a:hover span {
display:block;
	width: 400px;
} /* Bei "a:hover" wird es eingeblendet. */
-->
</style>
</head>

<body>

<ul id="navi">
<li>
<a href="grosse-zaubershow.php" class="navi">
<span>Für Kinder von 8 bis 99 Jahren.</span>
Große Zaubershow</a></li>
<li>
<a href="kinder-zaubershow.php" class="navi">
<span>Für Kinder von 3 bis 10 jahren</span>
Kinder Zaubershow</a> </li>
</ul>

</body>
</html>
Mit Zitat antworten
  #6 (permalink)  
Alt 27.10.2007, 23:16
Benutzerbild von Crizzo
der mit dem Editor kämpft
XHTMLforum-Kenner
 
Registriert seit: 17.10.2006
Ort: Ost-Hessen
Beiträge: 4.829
Crizzo ist ein sehr geschätzer MenschCrizzo ist ein sehr geschätzer MenschCrizzo ist ein sehr geschätzer MenschCrizzo ist ein sehr geschätzer Mensch
Standard

So geht es:
Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Unbenanntes Dokument</title>
<style type="text/css">
<!--
ul#navi li a span {
display:none;
} /* Ohne "hover" ist "span" ausgeblendet */

ul#navi li a:hover span {
display:block;
width: 400px;
background:blue;
color:#FFF;
position:absolute;
left:300px;
z-index:99;} /* Bei "a:hover" wird es eingeblendet. */
-->
</style>
</head>

<body>

<ul id="navi">
<li>
<a href="grosse-zaubershow.php" >
<span>Für Kinder von 8 bis 99 Jahren.</span>
Große Zaubershow</a></li>
<li>
<a href="kinder-zaubershow.php">
<span>Für Kinder von 3 bis 10 jahren</span>
Kinder Zaubershow</a> </li>
</ul>

</body>
</html>
Du hast nur "class" mit "id" verwechselt.

"id" ist die "#" in der CSS-Datei, "class" der "." Und hier war es sogar überflüssig im Element "a".

Ansonsten hab ich noch eine Schriftfarbe und Hintergrundfarbe für den "span" bestimmt und ihn per "position:absolute" weiter rechts positioniert.
"z-index" bestimmt noch, dass der "span" immer über alle anderen Elementen liegt und so immer sichtbar bleibt. Solange du kein Element mit einem höheren "z-index" Wert bestimmst.

Edit: Eigentlich sollte es jetzt funktionieren, klappt bei mir doch auch. Zum Beispiel hier: BlackHawk Zone >> Spiele >> Testberichte >> Company of Heroes bei den Bildern...

Edit2: Das gibts doch nicht, dass span-hovern funktioniert nicht. Aber bei meiner Seite gehts doch auch.
__________________
Ohne Quelltext gibts selten Hilfe. Also: Onlinebeispiel hochladen und Link bereitstellen!
Foren-FAQ

Geändert von Crizzo (27.10.2007 um 23:56 Uhr)
Mit Zitat antworten
  #7 (permalink)  
Alt 27.10.2007, 23:51
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 27.10.2007
Beiträge: 5
slave befindet sich auf einem aufstrebenden Ast
Standard

also entweder bin ich zu blöd oder mein browser hat ne macke
im IE7 und firefox alles super nur im IE6 geht es nicht !

hattest es doch im IE6 getestet und es lief , nur bei mir nicht, komisch

ich habe mir multipleIEs runtergeladen damit kann mann sich die seiten in verschiedenen IE versionen ansehen ,
das merkwürdige ist, wenn ich deine seite mit dem IE6 aufrufe funkt es auch
oh mann ich weiß nicht mehr weiter !


vielen dank aber trotzdem

Geändert von slave (27.10.2007 um 23:56 Uhr)
Mit Zitat antworten
  #8 (permalink)  
Alt 27.10.2007, 23:54
Benutzerbild von Crizzo
der mit dem Editor kämpft
XHTMLforum-Kenner
 
Registriert seit: 17.10.2006
Ort: Ost-Hessen
Beiträge: 4.829
Crizzo ist ein sehr geschätzer MenschCrizzo ist ein sehr geschätzer MenschCrizzo ist ein sehr geschätzer MenschCrizzo ist ein sehr geschätzer Mensch
Standard

Meine Seite geht im IE6 ohne Probleme, deine Testseite allerdings nicht. Momentan find ich den Fehler nicht, sry.
__________________
Ohne Quelltext gibts selten Hilfe. Also: Onlinebeispiel hochladen und Link bereitstellen!
Foren-FAQ
Mit Zitat antworten
  #9 (permalink)  
Alt 28.10.2007, 11:41
Erfahrener Benutzer
XHTMLforum-Kenner
 
Registriert seit: 28.01.2005
Beiträge: 11.778
fricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz sein
Standard

Der IE braucht bestimmte Angaben für a:hover.
Pure CSS Popups Bug - IE Bug
Mit Zitat antworten
Sponsored Links
  #10 (permalink)  
Alt 28.10.2007, 13:07
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 27.10.2007
Beiträge: 5
slave befindet sich auf einem aufstrebenden Ast
Standard

hallo und vielen dank an euch
für die hilfe habe es jetzt auch rausgefunden !

hier der code und dieser funkt im IE6 - IE7

Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="de" xml:lang="de">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Unbenanntes Dokument</title>
<style type="text/css">
<!--


ul#navi	{
	list-style-type: none;
}

ul#navi li a span {
display:none;
}

ul#navi li {
height:40px;
}


ul#navi a:hover {
	margin:0px;
	padding:0px;
	
}


ul#navi li a:hover span {
	margin-top:20px;
	display:block;
	width: 200px;
	position:absolute;
	text-decoration: none;
} 
-->
</style>
</head>

<body>

<ul id="navi">
<li><a href="grosse-zaubershow.php"><span>Für Kinder von 8 bis 99 Jahren.</span>Große Zaubershow</a></li>
<li><a href="kinder-zaubershow.php"><span>Für Kinder von 3 bis 10 jahren</span>Kinder Zaubershow</a></li>
</ul>

</body>
</html>
vielen dank nochmal ohne euch währe ich nicht darauf gekommen
DANKE DANKE DANKE
Mit Zitat antworten
Sponsored Links
Antwort

Themen-Optionen
Ansicht

Forumregeln
Es ist Ihnen nicht erlaubt, neue Themen zu verfassen.
Es ist Ihnen nicht erlaubt, auf Beiträge zu antworten.
Es ist Ihnen nicht erlaubt, Anhänge hochzuladen.
Es ist Ihnen nicht erlaubt, Ihre Beiträge zu bearbeiten.

BB-Code ist an.
Smileys sind an.
[IMG] Code ist an.
HTML-Code ist aus.
Trackbacks are an
Pingbacks are an
Refbacks are aus


Ähnliche Themen
Thema Autor Forum Antworten Letzter Beitrag
grafische Navigation horizontal zentrieren, klappt nicht lila_3 CSS 4 30.11.2010 10:25
Problem Browserweiche IE CSS 00001 CSS 5 24.09.2010 10:23
CSS Greybox Problem - HILFE! vsa CSS 9 12.01.2010 20:33
Boxen von Navigation und Logo sind zu weit auseinander lila_3 CSS 2 03.09.2009 23:28
Problem mit Layout- Totaler CSS Noob meici CSS 3 01.03.2008 16:33


Alle Zeitangaben in WEZ +2. Es ist jetzt 13:29 Uhr.