Links doen het niet in Firefox

[pweemer]

Hallo allen!

Mijn website is bijna klaar en ik ben er erg blij mee dat ik zover gekomen ben.
Helaas werkt 1 dingetje niet en als ik dit makkelijk kan oplossen, dan wil ik er graag nog wat tijd in steken.
De linkjes van 1 pagina werken namelijk niet in Firefox, wel in IE.
Inmiddels ben ik erachter dat dit komt door het gebruik van falling objects.
Het is een wedding website en er komen wat hartjes uit de lucht vallen.
Als ik alleen onderstaande code weglaat, werken de linkjes wel.
Iemand een idee hoe ik dit op zou kunnen lossen?

Code:
<marquee behavior="scroll" direction="down" scrollamount="5" style="position: absolute; left: 30px; top: 150px; height: 548px;"><span style="color: rgb(255, 0, 102) ! important;">♥</span></marquee>
<marquee behavior="scroll" direction="down" scrollamount="3" style="position: absolute; left: 71px; top: 170px; height: 388px;"><span style="color: rgb(255, 0, 102) ! important;">♥</span></marquee>
<marquee behavior="scroll" direction="down" scrollamount="5" style="position: absolute; left: 112px; top: 190px; height: 324px;"><span style="color: rgb(255, 0, 102) ! important;">♥</span></marquee>
Etc.

Alvast bedankt voor het meedenken!

 

[RogerS]

Dit zijn geen links maar scrollende tekst.

Check je links maar eens op het gebruik van de verkeerde slashes '\' in plaats van '/'. 10 tegen 1 is dat het

 

[pweemer]

Even een aanvulling:
De falling objects (scrollende tekst) doen het wel! Zelfs in Firefox.

Probleem is dat ik naast deze falling objects ook een menu heb met links naar de pagina's ceremonie, aanzoek, foto's etc.
Deze linkjes doen het niet op de pagina waar de falling objects staan in Firefox (in IE is het geen probleem).
Als ik de falling objects weglaat doen de links naar de andere pagina's het wel.

 

[pweemer]

Bedankt Roger voor je reactie.

Mijn links zien er als volgt uit (gedeeltelijk):

<li class="style3"> <a href="Aanzoek.html">Het aanzoek</a></li>
<li class="style3"> <a href="Ceremonie.html">Ceremonie &amp; Receptie</a></li>
<li class="style3"> <a href="Accomodatie.html">Accommodatie</a></li>

Wat zou ik moeten wijzigen volgens jou?

 

[RogerS]

Post eens even de volledige code. Waarschijnlijk ontbreekt er ergens een afsluiten tag </marquee> of </span>.

Open de code eens in notepad++ . Deze herkent de missende afsluiting ook.

 

[csshunter]

Hoi pweemer,
Je hebt helemaal gelijk! De code is op zich correct, maar als de links en de falling objects zich op hetzelfde territorium bevinden, zijn de links in Firefox niet aanklikbaar (de muisaanwijzer wordt ook geen handje), en in IE wel.

• Testpagina: www.developerscorner.nl/csshunter/tests/falling-objects-a.htm

Meteen even wat andere browsers getest: Opera10.10 doet het wel, en Safari5.0.1 en Chrome doen het gedeeltelijk. Deze hebben hele smalle baantjes voor de falling objects, en waar deze baantjes de links overlappen doen de links het niet, terwijl dezelfde links iets naast die baantjes gewoon werken.
Zijn de browsers in verwarring? :shocked:

De oorzaak zal gevonden moeten worden in het feit dat een <marquee> geen officiële html-tag is, en er ook geen voorschriften zijn over hoe browsers ermee om moeten gaan. En hoewel de <marquees> geen valid html zijn, ondersteunen de browsers ze toch: maar wel ieder op z'n eigen manier.
Kennelijk interpreteren een aantal browsers de <marquee> zodanig, dat ze vinden dat een <marquee> altijd in een bovenste laag moet zitten, en de bewegende deeltjes ervan boven de rest van de pagina-inhoud moeten zweven. Dan kan je er inderdaad met de muis niet "onder" komen, en zijn de links onbereikbaar.

Maar gelukkig houden de browsers zich wel aan de css-afspraken over hoe lagen gestapeld moeten worden. Dat gaat met de "z-index". Hoe hoger het getal op de z-as, hoe meer bovenop het element ligt.
Als we dit doen:

marquee {
	z-index: 1;
	}
ul {
	position: relative;
	margin-top: 160px;
	z-index: 2;
	}

gaan ook de (deels) niet werkende browsers overstag, en zijn de links te bereiken. *)

• Testpagina: www.developerscorner.nl/csshunter/tests/falling-objects-b.htm

Met vriendelijke groet,
CSShunter
___________________
*) Voor de z-index is altijd een opgave van een "position" nodig, anders werkt het niet. In ons geval had de <marquee> in de html-code al een position (absolute) toegewezen gekregen.