经典小窗口滑动门切换js特效代码，当用户的鼠标经过标题时立即切换显示，带关闭按钮功能供用户使用。
<style type="text/css">
body {
margin:0px;
text-align:center;
font-size:12px;
}
#wuming_ren {
margin:auto;
margin-top:35px;
width:300px;
height:200px;
background-color:#7DA7D9;
border:0px;
}
#title {
width:300px;
height:20px;
font-size:14px;
margin-top:4px;
}
#table1 table {
width:300px;
height:30px;
font-size:12px;
}
#table2 table {
width:300px;
height:30px;
font-size:12px;
}
#content1,#content2,#content3,#content4,#content5,#content6,#msg1,#msg2 {
margin:auto;
height:110px;
width:290px;
background-color:#eee;
position:relative;
}
#content1 div,#content2 div,#content3 div,#content4 div,#content5 div,#content6 div {
position:absolute;
bottom:3px;
right:3px;
cursor:pointer;
}
a {
text-decoration:none;
}
.changebordercolor {
border-top:1px solid #369;
border-left:1px solid #369;
}
.backbordercolor {
border:0px solid red;
}
</style>
<script language="javascript">
function msg(){
document.getElementById("msg1").style.display="none"
document.getElementById("msg2").style.display="none"
}
function msgnone(ms,cont){
document.getElementById(ms).style.display='block'
document.getElementById(cont).style.display='none'
}
function aa1(){
document.getElementById("content1").style.display="block"
document.getElementById("content2").style.display="none"
document.getElementById("content3").style.display="none"
document.getElementById("content4").style.display="none"
document.getElementById("content5").style.display="none"
document.getElementById("content6").style.display="none"
}//武鸣人网站https://www.wuming.ren 网站很好记住，wuming.ren(武鸣拼音.ren域名后缀)
function aa2(){
document.getElementById("content1").style.display="none"
document.getElementById("content2").style.display="block"
document.getElementById("content3").style.display="none"
document.getElementById("content4").style.display="none"
document.getElementById("content5").style.display="none"
document.getElementById("content6").style.display="none"
}//武鸣人网站https://www.wuming.ren 网站很好记住，wuming.ren(武鸣拼音.ren域名后缀)
function aa3(){
document.getElementById("content1").style.display="none"
document.getElementById("content2").style.display="none"
document.getElementById("content3").style.display="block"
document.getElementById("content4").style.display="none"
document.getElementById("content5").style.display="none"
document.getElementById("content6").style.display="none"
}//武鸣人网站https://www.wuming.ren 网站很好记住，wuming.ren(武鸣拼音.ren域名后缀)
function aa4(){
document.getElementById("content1").style.display="none"
document.getElementById("content2").style.display="none"
document.getElementById("content3").style.display="none"
document.getElementById("content4").style.display="block"
document.getElementById("content5").style.display="none"
document.getElementById("content6").style.display="none"
}//武鸣人网站https://www.wuming.ren 网站很好记住，wuming.ren(武鸣拼音.ren域名后缀)
function aa5(){
document.getElementById("content1").style.display="none"
document.getElementById("content2").style.display="none"
document.getElementById("content3").style.display="none"
document.getElementById("content4").style.display="none"
document.getElementById("content5").style.display="block"
document.getElementById("content6").style.display="none"
}//武鸣人网站https://www.wuming.ren 网站很好记住，wuming.ren(武鸣拼音.ren域名后缀)
function aa6(){
document.getElementById("content1").style.display="none"
document.getElementById("content2").style.display="none"
document.getElementById("content3").style.display="none"
document.getElementById("content4").style.display="none"
document.getElementById("content5").style.display="none"
document.getElementById("content6").style.display="block"
}//武鸣人网站https://www.wuming.ren 网站很好记住，wuming.ren(武鸣拼音.ren域名后缀)
</script>
<body onLoad="aa1();msg()">
<a href="https://www.wuming.ren">武鸣人</a>，各种信息资源免费发布，分享励志语录经典短句，减肥健身常识，各种js特效代码。网站很好记住，wuming.ren(武鸣拼音.ren域名后缀)<hr>
<!--欢迎来到武鸣人信息资源平台，各种信息免费发布，资源共享合作共赢，分享互联网流行的励志语录经典短句，减肥健身健康小常识及打卡记录，收集各种js特效代码。-->
<script type="text/javascript" src="https://www.wuming.ren/ad/tc.js"></script>
<script type="text/javascript" src="https://www.wuming.ren/ad/a.js"></script>
<div id="wuming_ren">
<div id="title">武鸣人实用选项卡</div>
<div id="table1">
<table cellpadding=0 cellspacing=0 boder=0>
<tr align=center>
<td onMouseOver="this.bgColor='#33ccff';aa1();msg();this.className='changebordercolor'" onMouseOut="this.bgColor='#7DA7D9';this.className='backbordercolor'"><a href="https://www.wuming.ren">游戏下载</a></td>
<td onMouseOver="this.bgColor='#33ccff';aa2();msg();this.className='changebordercolor'" onMouseOut="this.bgColor='#7DA7D9';this.className='backbordercolor'"><a href="https://www.wuming.ren">游戏下载</a></td>
<td onMouseOver="this.bgColor='#33ccff';aa3();msg();this.className='changebordercolor'" onMouseOut="this.bgColor='#7DA7D9';this.className='backbordercolor'"><a href="https://www.wuming.ren">游戏下载</a></td>
</tr></table></div>
<div id="content1">武鸣人一号内容<div onClick="msgnone('msg1','content1')">关闭</div></div>
<div id="content2">武鸣人二号内容<div onClick="msgnone('msg1','content2')">关闭</div></div>
<div id="content3">武鸣人三号内容<div onClick="msgnone('msg1','content3')">关闭</div></div>
<div id="msg1">wuming.ren提示您：没有选择类型</div>
<div id="table2">
<table cellpadding=0 cellspacing=0 boder=0>
<tr align=center>
<td onMouseOver="this.bgColor='#33ccff';aa4();msg();this.className='changebordercolor'" onMouseOut="this.bgColor='#7DA7D9';this.className='backbordercolor'"><a href="https://www.wuming.ren">游戏下载</a></td>
<td onMouseOver="this.bgColor='#33ccff';aa5();msg();this.className='changebordercolor'" onMouseOut="this.bgColor='#7DA7D9';this.className='backbordercolor'"><a href="https://www.wuming.ren">游戏下载</a></td>
<td onMouseOver="this.bgColor='#33ccff';aa6();msg();this.className='changebordercolor'" onMouseOut="this.bgColor='#7DA7D9';this.className='backbordercolor'"><a href="https://www.wuming.ren">游戏下载</a></td>
</tr></table></div>
<div id="content4">武鸣人四号内容<div onClick="msgnone('msg3','content4')">关闭</div></div>
<div id="content5">武鸣人五号内容<div onClick="msgnone('msg2','content5')">关闭</div></div>
<div id="content6">武鸣人六号内容<div onClick="msgnone('msg2','content6')">关闭</div></div>
<div id="msg2">wuming.ren提示您：没有选择类型</div>
</div>
</body>本文来自武鸣人网站，转载请注明出处