用js+css+div实现换图,类似网站换皮肤,求完整、简单的代码谢谢
发布网友
发布时间:2022-04-06 11:36
我来回答
共1个回答
热心网友
时间:2022-04-06 13:05
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<style type="text/css">
body {
font-family: Arial, Helvetica, sans-serif;
font-size: 14px;
line-height: 23px;
color: #999;
background-color: #FCF;
}
.aaa{
background-image: url(aaa.png);
height: 312px;
width: 440px;position: relative;
}
.bbb{
background-image: url(bbb.png);
height: 312px;
width: 440px;position: absolute;
}
.ccc{
background-image: url(ccc.png);
height: 312px;
width: 440px;position: absolute;
}
</style>
</head>
<body>
<div class="aaa">
<div class="bbb"></div>
<div class="ccc"></div>
</div>
<div id="bg" class="">
<ul>
<li><a href="javascript:cat('aaa1');">aaa1</a></li>
<li><a href="javascript:cat('aaa2');">aaa2</a></li>
<li><a href="#">aaa3</a></li>
<li></li>
<li><a href="#">bbb1</a></li>
<li><a href="#">bbb2</a></li>
<li><a href="#">bbb3</a></li>
<li><a href="#">bbb4</a></li>
<li></li>
<li><a href="#">ccc1</a></li>
<li><a href="#">ccc2</a></li>
<li><a href="#">ccc3</a></li>
</ul>
</div>
</body>
<script type="text/javascript">
function cat(cla)
{
var id=document.getElementById('bg');
id.setAttribute("class",cla);
}
</script>
</html>
追问ie8下无反应,火狐下效果不错,就是我要的效果,能不能兼容一下ie浏览器,谢谢
追答将
id.setAttribute("class",cla);
改成
id.className=cla;
就行了