Posts o[css] html checkbox with image states
Post
Cancel

o[css] html checkbox with image states

reference http://stackoverflow.com/a/16353114 http://stackoverflow.com/a/8809891


http://www.sitepoint.com/15-jquery-radio-button-checkbox-style-plugins/ http://www.thheuer.com/2011/10/jquery-plugins-image-radio-buttons/

ScrewDefaultButtonsV2** http://github.com/mattSOLANO/ScrewDefaultButtonsV2 or http://screwdefaultbuttons.com/ ———-

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
//test

		<style>
			.checkbox {
				width: 26px;
				height: 26px;
				background: transparent url(checkbox.png) }
			.checked {
				background: transparent url(checkbox_on.png)}
		</style>

			$(function()
				{
					//button click
					$('#btn').on('click', function(e) {
							var bg_url = $('#test').css('background-image');

							if (bg_url.indexOf('_on.png')>0)
								console.log("checked");	
							else 
								console.log("un_checked");	

							console.log(bg_url);
					});

					$("#test").click(function() {
							$(this).toggleClass('checked')
					});

				});

		<div id="test" class="checkbox"></div>

		<button id="btn">
			Test
		</button>

the test, when button ‘btn’ clicked:

the buttons

</strong>

origin - http://www.pipiscrew.com/?p=2657 css-html-checkbox-with-image-states

This post is licensed under CC BY 4.0 by the author.
Contents

Trending Tags