js之类似tab实现二预实现效果....

一:原理:

1.采用div的style属性.style.display="none";或.style.display="block"; 控制是否显示!!!

2.主要用到的几个js

<script>
 
function changeFirst(id){

var cat=document.getElementById("cat"+id);
var img=document.getElementById("img"+id)
if(cat.style.display=="block"){
 cat.style.display
="none";
 
}
else{
 cat.style.display
="block";
 
}
}
function change(id){

var cat=document.getElementById("cat_"+id);
var img=document.getElementById("img_"+id)
if(cat.style.display=="block"){
 cat.style.display
="none";
 img.innerHTML
="<img src='images/+.gif' />";
}
else{
 cat.style.display
="block";
 img.innerHTML
="<img src='images/-.gif' />";
}

}
function changeLast(id){

var cat=document.getElementById("cat__"+id);
var img=document.getElementById("img__"+id)
if(cat.style.display=="block"){
 cat.style.display
="none";
img.innerHTML
="<img src='images/+.gif' />";
}
else{
 cat.style.display
="block";
 img.innerHTML
="<img src='images/-.gif' />";
}

}

</script>

相关文章: