jquery 各种不同效果的自定义美化input radio checkbox 单选框和复选框美化

jquery 各种不同效果的自定义美化input radio checkbox 单选框和复选框美化

本站之前发过类似的文章《jquery 各种不同效果的自定义美化input radio checkbox 单选框和复选框美化》

本列更加简洁

css和js文件请到演示页面查看源码

演示

 

 

XML/HTML Code

1. <input type="radio" name="reading" value="0" id="reading_0" /> <label for="reading_0">Very much</label>  
2. <input type="radio" name="reading" value="1" id="reading_1" /> <label for="reading_1">Sometimes</label>  
3. <input type="radio" name="reading" value="2" id="reading_2" /> <label for="reading_2">Better watch movie</label>  
4. <input type="radio" name="reading" value="3" id="reading_3" /> <label for="reading_3">Hate it</label><br>  
5. <br>  
6. <label><input type="checkbox" name="think" value="0" /> Self</label>  
7. <label><input type="checkbox" name="think" value="1" /> Money</label>  
8. <label><input type="checkbox" name="think" value="2" /> Stuff</label>  
9. <label><input type="checkbox" name="think" value="3" /> Health</label>  
10. <label><input type="checkbox" name="think" value="4" /> Work</label>  
11. <label><input type="checkbox" name="think" value="5" checked /> Rest</label>  
12. <label><input type="checkbox" name="think" value="6" disabled checked /> Sex</label>  
13. <script>  
14. $(function(){  
15.     $("input[type='radio'], input[type='checkbox']").ionCheckRadio();  
16. });  
17. </script>  

 

原文地址:http://www.freejs.net/article_biaodan_206.html