nicht angemeldet
<img> innerhalb von <label> mit IE 6
Hallo,
folgender Code:
<input type="checkbox" name="chk1" id="chk1">
<label for="chk1">
<img src="grafik.jpg" alt="">
</label>
funktioniert mit Firefox einwandfrei, mit IE 6 aber nicht, obwohl lt. Selfhtml ein <img>-Tag als Inline-Element innerhalb von <label> vorkommen darf. Ein IE-Bug?
Vielen Dank für die Hilfe.
Mit freundlichen Grüßen
Klaus
-
Hallo
habe den Code bei mir eingegeben funktioniert mit IE 6 einwandfrei.
mfg hans
-
Hallo hans.
habe den Code bei mir eingegeben funktioniert mit IE 6 einwandfrei.
Kann ich in meinen IEs (5.0, 5.5, 6.0) nicht bestätigen.
Du kannst auf die Grafik klicken, woraufhin die Checkbox (de)aktiviert wird?Einen schönen Donnerstag noch.
Gruß, Ashura
--
sh:( fo:} ch:? rl:( br: n4:~ ie:{ mo:| va:) de:> zu:} fl:( ss:) ls:[ js:|
„It is required that HTML be a common language between all platforms. This implies no device-specific markup, or anything which requires control over fonts or colors, for example. This is in keeping with the SGML ideal.“
[HTML Design Constraints: Logical Markup]-
Hi,
hab jetzt deinen Code nicht ausprobiert, aber ich hab an anderer Stelle auch so ein Konstrukt, dass in meinem IE6 einwandfrei funktioniert.
<input type="radio" name="u_str_format" value="EXCEL_CSV" style="vertical-align: top" checked="checked" id="check1_xls">
<label for="check1_xls"><img src="http://issos-plus.esg.de/4451/images/4451_issos_excel.gif" alt="Ausgabeformat: Excel / CSV"></label>
<input type="radio" name="u_str_format" value="HTML" style="vertical-align: top" id="check1_html">
<label for="check1_html"><img src="http://issos-plus.esg.de/4451/images/4451_issos_html.gif" alt="Ausgabeformat: Webseite / HTML"></label>MfG
Rouven--
-------------------
ie:| fl:| br:> va:| ls:& fo:) rl:( n4:{ ss:) de:] js:| ch:? mo:} zu:|-
Hallo,
habe den IE 6.0.2600.0000IC
und bei mir funktioniert weder mein Code noch Deiner so, wie er soll:
Beim Klick auf die Grafik soll die Checkbox markiert bzw. wieder demarkiert werden.
-
Hallo,
Beim Klick auf die Grafik soll die Checkbox markiert bzw. wieder demarkiert werden.
Zwei mögliche Workarounds:
1. mit JavaScript:<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html> <head> <title>Titel</title> <meta http-equiv="content-type" content="text/html; charset=ISO-8859-1"> <style type="text/css"> form p {margin:0; padding:0;} form p * {vertical-align:middle;} form label img {height:32px; width:32px;} </style> </head> <body> <form action="#" method="get"> <p><input id="chk11" type="checkbox" name="chk11" value="v11"><label for="chk11"><img src="Beispiel.jpg" alt="Bild chk11" title="" onclick="if(this.parentNode.click)this.parentNode.click();"></label></p> <p><input id="chk12" type="checkbox" name="chk12" value="v12"><label for="chk12"><img src="Beispiel.jpg" alt="Bild chk12" title="" onclick="if(this.parentNode.click)this.parentNode.click();"></label></p> </form> </body> </html>Ich denke, das ist selbsterklärend. Es zeigt auch, wo der Fehler des IE liegt. Das IMG-Element verkonsumiert im Normalfall die Klick-Aktion einfach, ohne sie an das LABEL-Element weiterzuleiten.
2. ohne JavaScript:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html> <head> <title>Titel</title> <meta http-equiv="content-type" content="text/html; charset=ISO-8859-1"> <style type="text/css"> form p {margin:0; padding:0;} form p * {vertical-align:middle;} form label img {height:32px; width:32px;} </style> <!--[if ie]> <style type="text/css"> form label img {visibility:hidden;} form label {background-image:url(Beispiel.jpg);} </style> <![endif]--> </head> <body> <form action="#" method="get"> <p><input id="chk11" type="checkbox" name="chk11" value="v11"><label for="chk11"><img src="Beispiel.jpg" alt="Bild chk11" title=""></label></p> <p><input id="chk12" type="checkbox" name="chk12" value="v12"><label for="chk12"><img src="Beispiel.jpg" alt="Bild chk12" title=""></label></p> </form> </body> </html>Für den IE wird das eigentliche IMG-Element unsichtbar. Sichtbar wird dadurch ein entsprechendes Hintergrundbild. Da nun das IMG nicht mehr geklickt werden kann, bekommt das LABEL-Element den Klick auch mit.
viele Grüße
Axel
-
-
Hallo Rouven.
hab jetzt deinen Code nicht ausprobiert, aber ich hab an anderer Stelle auch so ein Konstrukt, dass in meinem IE6 einwandfrei funktioniert.
Eben überprüft, funktioniert hier nicht. Bei den Radioboxen tut sich nichts. Merkwürdigerweise erscheint bei Direktauswahl der Radiobox der gestrichelte Rahmen um die zugehörige Grafik.
Einen schönen Freitag noch.
Gruß, Ashura
--
sh:( fo:} ch:? rl:( br: n4:~ ie:{ mo:| va:) de:> zu:} fl:( ss:) ls:[ js:|
„It is required that HTML be a common language between all platforms. This implies no device-specific markup, or anything which requires control over fonts or colors, for example. This is in keeping with the SGML ideal.“
[HTML Design Constraints: Logical Markup]
-
-
-