xn1 Posted March 28, 2011 Share Posted March 28, 2011 Hi all, I'm using an image as a checkbox label and I'm having a strange problem. When you move the mouse over the image, the associated checkbox highlights (as it should). However, clicking the image does not select the checkbox and I can't figure out why. Is this function not possible? Quote Link to comment Share on other sites More sharing options...
cssfreakie Posted March 28, 2011 Share Posted March 28, 2011 can you provide some code, I never used an image as a label but i bet it's possible. -edit (2 minutes later )and it is possible: try this: <!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"> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <link type="text/css" rel="stylesheet" href="css/style.css" /> <title>image as label</title> </head> <body> <form action="" method="post"> <label for="name"><img src="image/button.png" alt="" /></label> <input type="text" id="name" name="name" value="" /> </form> </body> </html> edit- 2 Oh wait, a check box, you need to do that with javascript. something like on.click set value to check Quote Link to comment Share on other sites More sharing options...
cssfreakie Posted March 28, 2011 Share Posted March 28, 2011 well i just tried this and it works, not sure if it's clean javascript, but that what the javascript forum is for: good luck!! <!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"> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <link type="text/css" rel="stylesheet" href="css/style.css" /> <title>image as label</title> </head> <body> <form action="" method="post"> <label for="mycheckbox" onclick="document.getElemenstById.mycheckbox.checked = true;"><img src="images/button.png" alt="" /></label> <input type="checkbox" id="mycheckbox" name="mycheckbox" value="ON" /> </form> </body> </html> Quote Link to comment Share on other sites More sharing options...
xn1 Posted March 28, 2011 Author Share Posted March 28, 2011 Is there no other way than Js? Seems strange that html will let the image be the label and highlight the checkbox when your over the image but it won't let you select it Quote Link to comment Share on other sites More sharing options...
cssfreakie Posted March 28, 2011 Share Posted March 28, 2011 Is there no other way than Js? Seems strange that html will let the image be the label and highlight the checkbox when your over the image but it won't let you select it as far as I know there is not, because you are changing the value of another element. Did it work for you? if so let me know. Quote Link to comment Share on other sites More sharing options...
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.