js动态改变tab背景图片。求大神赐教，jquery做出来也行。
比如3个选项卡，分别是1，2，3.页面打开的时候1是有背景图片的，2和3没有，点击2，1和3都没有背景，2是有背景的。鼠标拿开之后背景也存在，除非刷新或者点击其他的选项卡...
比如3个选项卡，分别是1，2，3.页面打开的时候1是有背景图片的，2和3没有，点击2，1和3都没有背景，2是有背景的。鼠标拿开之后背景也存在，除非刷新或者点击其他的选项卡背景才会变化。其实就是网上很多网页有的，但是就是不知道该怎么做。求给详细步骤或者把全部代码贴上来。不要多余的，比如3个标签对应的DIV隐藏的代码不要哈。谢谢了。
展开
展开全部
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title> New Document </title>
<meta name="Generator" content="EditPlus">
<meta name="Author" content="">
<meta name="Keywords" content="">
<meta name="Description" content="">
</head>
<style>
li{
list-style:none;
width:30px;
height:30px;
float:left;
border:1px solid #ddd;
}
</style>
<script type="text/javascript">
<!--
window.onload = function(){
var tab = document.getElementById("tab");
var lis = tab.getElementsByTagName("li");
lis[0].style.backgroundColor = "#f00";
for(var i=0;i<lis.length;i++){
lis[i].i = 0;
lis[i].onclick = function(){
for(var j=0;j<lis.length;j++){
if(lis[j] == this){
lis[j].style.backgroundColor = "#f00";
}else{
lis[j].style.backgroundColor = "";
}
}
}
}
}
//-->
</script>
<body>
<ul id="tab">
<li></li>
<li></li>
<li></li>
</ul>
</body>
</html>
<html>
<head>
<title> New Document </title>
<meta name="Generator" content="EditPlus">
<meta name="Author" content="">
<meta name="Keywords" content="">
<meta name="Description" content="">
</head>
<style>
li{
list-style:none;
width:30px;
height:30px;
float:left;
border:1px solid #ddd;
}
</style>
<script type="text/javascript">
<!--
window.onload = function(){
var tab = document.getElementById("tab");
var lis = tab.getElementsByTagName("li");
lis[0].style.backgroundColor = "#f00";
for(var i=0;i<lis.length;i++){
lis[i].i = 0;
lis[i].onclick = function(){
for(var j=0;j<lis.length;j++){
if(lis[j] == this){
lis[j].style.backgroundColor = "#f00";
}else{
lis[j].style.backgroundColor = "";
}
}
}
}
}
//-->
</script>
<body>
<ul id="tab">
<li></li>
<li></li>
<li></li>
</ul>
</body>
</html>
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
样式部分：
.selected {background-image: url('...')}
页面部分：
<ul id="tab">
<li class="selected">1</li>
<li>2</li>
<li>3</li>
</ul>
js部分：
jQuery('#tab li').click(function(){
jQuery('#tab li').removeClass('selected');
jQuery(this).addClass('selected');
});
.selected {background-image: url('...')}
页面部分：
<ul id="tab">
<li class="selected">1</li>
<li>2</li>
<li>3</li>
</ul>
js部分：
jQuery('#tab li').click(function(){
jQuery('#tab li').removeClass('selected');
jQuery(this).addClass('selected');
});
本回答被提问者采纳
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
分别给1.2.3.id，$("#id").css("background","图片路径");
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
更多回答（1）
推荐律师服务：
若未解决您的问题，请您详细描述您的问题，通过百度律临进行免费专业咨询
