1、下载到的压缩包,上传到网站根目录下。
2、解压出来,复制index.html里面的主要代码,插入到网站项目想要放置的位置。
3、对插入的代码,根据自己需求对文字以及图片做适当的修改和替换,即可投入到自己网站中使用以及呈现。
纯js为你解答:<br><button id="btn1">选项卡1</button><br><button id="btn2">选项卡2</button><br><p id="p1" >我是第一块</p><br><p id="p2" style="display:none">我是第二块</p><br><script><br> for(var r = 1r<=2r++){<br>document.getElementById("btn"+r).setAttribute("i", r)<br>document.getElementById("btn"+r).onclick = function(){<br> for(var j = 1j<=2j++){<br>document.getElementById("p"+j).style.display = "none"<br> }<br> // alert(1)<br> document.getElementById("p"+this.getAttribute("i")).style.display = "block"<br>}<br> }<br></script><br><br>有疑问大可继续追问。<!doctype html><html>
<meta charset="utf-8">
<head>
<title>DIV层切换</title>
<script language="Javascript" type="text/javascript">
function ChangeDiv(divId,divName,zDivCount)
{
for(i=0i<=zDivCounti++)document.getElementById(divName+i).style.display="none"/*将所有的层都隐藏*/
document.getElementById(divName+divId).style.display="block"
//显示当前层
}
</script>
</head>
<body>
<a href="Javascript:" onMouseOver="ChangeDiv('0','JKDiv_',2)">内容一</a>
<a href="Javascript:" onMouseOver="ChangeDiv('1','JKDiv_',2)">内容二</a>
<a href="Javascript:" onMouseOver="ChangeDiv('2','JKDiv_',2)">内容三</a>
<div id="JKDiv_0" style="font-size:14pxmargin:20pxcolor:#FF0000">内容部分第一区</div>
<div id="JKDiv_1" style="display:nonefont-size:14pxmargin:20pxcolor:#FF0000">内容部分第二区</div>
<div id="JKDiv_2" style="display:nonefont-size:14pxmargin:20pxcolor:#FF0000">内容部分第三区</div>
</body>