Simple Switch
//本次编写使用jQuery版本为 1.8.3
<script type="text/javascript" src="js/183.js"></script>
//引用核心文件
<script type="text/javascript" src="js/simple.switch.min.js"></script>
<link rel="stylesheet" href="css/simple.switch.three.css" type="text/css">
//压缩后的JS文件不到3K

Flat:

Code:

<input type="checkbox" class="checkbox" disabled>
<input type="checkbox" class="checkbox" disabled checked>
<input type="checkbox" class="checkbox">
<input type="checkbox" class="checkbox" checked>
<script>
	$(".checkbox").simpleSwitch();
</script>

FlatRadius:

Code:

<input type="checkbox" class="checkbox" disabled>
<input type="checkbox" class="checkbox" disabled checked>
<input type="checkbox" class="checkbox">
<input type="checkbox" class="checkbox" checked>
<script>
	$(".checkbox").simpleSwitch({
		"theme": "FlatRadius"
	});
</script>

FlatCircular:

Code:

<input type="checkbox" class="checkbox" disabled>
<input type="checkbox" class="checkbox" disabled checked>
<input type="checkbox" class="checkbox">
<input type="checkbox" class="checkbox" checked>
<script>
	$(".checkbox").simpleSwitch({
		"theme": "FlatCircular"
	});
</script>

Default:

Code:

<input type="checkbox" class="checkbox" disabled>
<input type="checkbox" class="checkbox" disabled checked>
<input type="checkbox" class="checkbox">
<input type="checkbox" class="checkbox" checked>
<script>
	$(".checkbox").simpleSwitch({
		"theme": "Default"
	});
</script>

DefaultMin:

Code:

<input type="checkbox" class="checkbox" disabled>
<input type="checkbox" class="checkbox" disabled checked>
<input type="checkbox" class="checkbox">
<input type="checkbox" class="checkbox" checked>
<script>
	$(".checkbox").simpleSwitch({
		"theme": "DefaultMin"
	});
</script>

Green:

Code:

<input type="checkbox" class="checkbox" disabled>
<input type="checkbox" class="checkbox" disabled checked>
<input type="checkbox" class="checkbox">
<input type="checkbox" class="checkbox" checked>
<script>
	$(".checkbox").simpleSwitch({
		"theme": "Green"
	});
</script>
PS: 使用此主题的时候,必须提前引用 Font-Awesome 

Icon:

Code:

<input type="checkbox" class="checkbox" disabled>
<input type="checkbox" class="checkbox" disabled checked>
<input type="checkbox" class="checkbox">
<input type="checkbox" class="checkbox" checked>
<script>
	$(".checkbox").simpleSwitch({
		"theme": "Icon"
	});
</script>
PS: 使用此主题的时候,必须提前引用 Font-Awesome 
Author is Lukang . . 最后更新于2016年7月19日