html中,点击div,使其更换背景图片,两张图片来回切换
首先设定div的背景图片为1.点击后,div的背景图片变为2.再次点击这个div,背景图片又变回1.就是这样的一个循环过程,可以直接写在div里的onclick上,也可以...
首先设定div的背景图片为1.点击后,div的背景图片变为2.再次点击这个div,背景图片又变回1.就是这样的一个循环过程,可以直接写在div里的onclick上,也可以写成js。只是希望速度快点,并且能用,兼容性没问题
展开
3个回答
展开全部
稍等上代码!
你好我写的例子是用jquery来写的,引用的网上的地址,你可以直接用。
<!DOCTYPE html>
<html>
<head>
<meta charset='utf-8' />
<title>JS Bin</title>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
<style>
.box1{
width: 698px;
height: 258px;
border: 1px solid #ccc;
background: url(http://www.snowinmay.net/6rooms/html/img/gsh/gsh_banner3.jpg) no-repeat;
}
.changeBg{
background: url(http://www.snowinmay.net/6rooms/html/img/gsh/gsh_banner1.jpg) no-repeat;
}
</style>
</head>
<body>
<div class="box1">
</div>
<script>
$(function(){
$('.box1').toggle(function() {
$(this).addClass('changeBg');
}, function() {
$(this).removeClass('changeBg');
});
})
</script>
</body>
</html>
希望能帮你,有问题可以追问!
追答
有问题可以举行交流
展开全部
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>无标题文档</title>
</head>
<body>
<script src="模板/js/jquery-1.8.0.js"></script>
<script>
$(function (){
$('#div1').toggle(
function (){
$(this).css('background','blue')
},
function (){
$(this).css('background','red')
}
)
})
</script>
<div style="background:red;width:50px;height:50px" id='div1' ></div>
</body>
</html>
更多追问追答
追问
额,我想要的是背景图片的切换,不是背景颜色,并且这颜色点击后也没有变化
追答
这是JQuery 你自己得引入库文件 背景颜色能切 难道背景图很难? 我暂时没时间帮你了 不好意思 你可以看看 有效果的 JQ 简单
已赞过
已踩过<
评论
收起
你对这个回答的评价是?
2013-12-26
展开全部
toggle在jquery1.9版本后就不支持了
已赞过
已踩过<
评论
收起
你对这个回答的评价是?
推荐律师服务:
若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询