xerox02 Posted June 25, 2010 Share Posted June 25, 2010 <form> <fieldset> <input id="box" name="box" type="checkbox" value="true"> <label for="box">Checkbox</label> <input type="submit"> </fieldset> </form> <script type="text/javascript"> function ImageCheckbox(inputElement, imageSrcOn, imageSrcOff) { var input = inputElement; var image = createImageElement(); function createImageElement() { var img = document.createElement('img'); if(input.checked) { img.setAttribute('src', imageSrcOn); } else { img.setAttribute('src', imageSrcOff); } img.addEventListener('click', toggle, true); input.parentNode.insertBefore(img, input); input.addEventListener('click', toggle, true); input.style.display = 'none'; return img; } function toggle(e) { if(e.currentTarget.nodeName.toLowerCase() == 'img') { input.checked = !input.checked; } image.src = (input.checked ? imageSrcOn : imageSrcOff); } } var checkbox = new ImageCheckbox(document.getElementById('box'), 'http://www.x2od.com/wp/uploads/true.gif', 'http://www.x2od.com/wp/uploads/false.gif'); </script> How do I customize the submit button, and add rollover to the checkbox in this code? Quote Link to comment Share on other sites More sharing options...
xerox02 Posted June 25, 2010 Author Share Posted June 25, 2010 bump 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.