喜迪情感
您的当前位置:首页单选按钮、多选按钮用图片实现加样式_HTML/Xhtml_网页制作

单选按钮、多选按钮用图片实现加样式_HTML/Xhtml_网页制作

来源:喜迪情感
 之前一直看到有人在问,单选按钮和多选按钮怎么加样式、怎么把按钮变大?下面把我做的一个例子分享出来。

1.首先把按钮做成图片

2.html页面

代码如下:






$(function(){
$("input[type='checkbox']").click(function(){
if($(this).is(':checked')){
$(this).attr("checked","checked");
$(this).parent().removeClass("c_off").addClass("c_on");
}else{
$(this).removeAttr("checked");
$(this).parent().removeClass("c_on").addClass(" c_off");
}
});
$("input[type='radio']").click(function(){
$("input[type='radio']").removeAttr("checked");
$(this).attr("checked","checked");
$(this).parent().removeClass("r_off").addClass("r_on").siblings().removeClass("r_on").addClass("r_off");
});
});











显示全文