动态选项卡特效
来源：互联网 发布：利用淘宝信用卡套现 编辑：程序博客网 时间：2024/05/17 00:04
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"><html><head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8"><title>Untitled Document</title><style>div{width: 400px;height: 300px;border:1px solid red;position:absolute;padding-top:20px;}</style><script>function init() {document.getElementById('d2').style.display = "none";document.getElementById('d3').style.display = "none";document.getElementById('sp1').style.color = "red";}function doCik(idx) {var divArr = new Array("d1", "d2", "d3");var spArr = new Array("sp1", "sp2", "sp3");for(var i=0; i<divArr.length; i++) {if (idx == divArr[i]) {document.getElementById(divArr[i]).style.display = "block";document.getElementById(spArr[i]).style.color = "red";}else {document.getElementById(divArr[i]).style.display = "none";document.getElementById(spArr[i]).style.color = "#000000";}}}</script></head><body onload="init();"><span id="sp1" onclick="doCik('d1')">新闻</span> |<span id="sp2" onclick="doCik('d2')">体育</span> |<span id="sp3" onclick="doCik('d3')">娱乐</span> <br><div style="width:402px; height:322px; padding-top:0px;"><div id="d1">新闻版内容</div><div id="d2">体育版内容</div><div id="d3">娱乐版内容</div></div></body></html>
