<!DOCTYPE html>
<html lang="en">
<script src="jquery-1.8.3.min.js"></script>
<head>
<meta charset="UTF-8">
<title>切换背景图</title>
<style>
.check {
text-align: right;
font-size: 24px;
height: 50px;
width: 150px;
background: url(agree.png) left center no-repeat;
}
.checkbox {
width: 50px;
height: 50px;
vertical-align: middle;
filter: alpha(opacity=0);
-moz-opacity: 0;
-khtml-opacity: 0;
/*opacity: 0; */
}
label {
vertical-align: middle;
}
</style>
</head>
<body>
<div class="check">
<input id="checkbox1" class="checkbox" type="checkbox" checked="checked" /><label>记住密码</label>
</div>
</body>
</html>
<script>
$(document).ready(function() {
var flag = 1;
$(".check").click(function() {
if (flag == 1) {
$(".check").css("background", "url(agrees.png) left center no-repeat");
flag = 0;
} else {
$(".check").css("background", "url(agree.png) left center no-repeat");
flag = 1;
}
})
});
</script>
js切换背景图
于 2018-04-17 11:16:11 首次发布