Jump to content

3 State Checkbox (with rollover & submit)


xerox02

Recommended Posts

		<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?

Link to comment
https://forums.phpfreaks.com/topic/205849-3-state-checkbox-with-rollover-submit/
Share on other sites

Archived

This topic is now archived and is closed to further replies.

×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.