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? Link to comment https://forums.phpfreaks.com/topic/231955-image-as-checkbox-label-problem/ 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 Link to comment https://forums.phpfreaks.com/topic/231955-image-as-checkbox-label-problem/#findComment-1193259 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> Link to comment https://forums.phpfreaks.com/topic/231955-image-as-checkbox-label-problem/#findComment-1193266 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 Link to comment https://forums.phpfreaks.com/topic/231955-image-as-checkbox-label-problem/#findComment-1193295 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. Link to comment https://forums.phpfreaks.com/topic/231955-image-as-checkbox-label-problem/#findComment-1193307 Share on other sites More sharing options...
Recommended Posts
Archived
This topic is now archived and is closed to further replies.