表格图层可展开和闭合效果-JS特效-爱易网页

表格图层可展开和闭合效果

日期：2014-05-18　浏览次数：20208 次

以下是程序代码

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta name="keywords" content="站长,网页特效,js特效,广告代码,zzjs,zzjs.net,sky,www.zzjs.net,站长特效 网" />
<meta name="description" content="www.zzjs.net,站长特效网，站长必备js特效及广告代码。大量高质量js特效，提供高质量广告代码下载,尽在站长特效网" />
<title>表格图层可展开闭合特效，sky整理收集，站长特效网欢迎您。</title>
</head>
<body>
<style type="text/css">
DIV.clTopMenu{position:absolute; width:101; height:150; clip:rect(0,101,14,0); visibility:hidden; z-index:31; layer-background-color:#EEEEEE; background-color:#00CCFF}
DIV.clTopMenuBottom{position:absolute; width:101; height:3; clip:rect(0,101,3,0); top:11; layer-background-color:#CECFCE; background-color:#000099; z-index:2}
DIV.clTopMenuText{position:absolute; width:91; left:5; top:15; font-family:"Arial", "Helvetica", "sans-serif"; font-size:9pt; background-color:#EEEEEE; z-index:1; color: #000000}
a:link {  color: #000000; text-decoration: none}
</style>
<script language="JavaScript" type="text/javascript">
/**********************************************************************************
NewsMenu
*   Copyright (C) 2001 Thomas Brattli
*   This script was released at DHTMLCentral.com
*   Visit for more great scripts!
*   This may be used and changed freely as long as this msg is intact!
*   We will also appreciate any links you could give us.
*
*   Made by Thomas Brattli
*********************************************************************************/
function lib_bwcheck(){ //Browsercheck (needed)
	this.ver=navigator.appVersion
	this.agent=navigator.userAgent
	this.dom=document.getElementById?1:0
	this.opera5=this.agent.indexOf("Opera 5")>-1
	this.ie5=(this.ver.indexOf("MSIE 5")>-1 && this.dom && !this.opera5)?1:0;
	this.ie6=(this.ver.indexOf("MSIE 6")>-1 && this.dom && !this.opera5)?1:0;
	this.ie4=(document.all && !this.dom && !this.opera5)?1:0;
	this.ie=this.ie4||this.ie5||this.ie6
	this.mac=this.agent.indexOf("Mac")>-1
	this.ns6=(this.dom && parseInt(this.ver) >= 5) ?1:0;
	this.ns4=(document.layers && !this.dom)?1:0;
	this.bw=(this.ie6 || this.ie5 || this.ie4 || this.ns4 || this.ns6 || this.opera5)
	return this
}
var bw=new lib_bwcheck()
/********************************************************************************
If you want to change the appearens on the text, background-colors, size or
anything do that in the style tag above.
This menu might not be as easy to adapt to your own site, but please
play around with it before you mail me for help...
****************************************************************************/
/***************************************************************************
Variables to set.
****************************************************************************/
//There are 2 ways these menus can be placed
// 0 = column
// 1 = row
nPlace=0
//How many menus do you have? (remember to copy and add divs in the body if you add menus)
var nNumberOfMenus=2
//修改图层的显示位置
var nMwidth=101 //The width on the menus (set the width in the stylesheet as well)
var nPxbetween=20 //Pixels between the menus
var nFromleft=10 //The first menus left position
var nFromtop=20 //The top position of the menus
var nBgcolor='#CECFCE' //The bgColor of the bottom mouseover div
var nBgcolorchangeto='#6380BC' //The bgColor to change to
var nImageheight=11 //The position the mouseover line div will stop at when going up!
/***************************************************************************
You shouldn't have to change anything below this
****************************************************************************/
//Object constructor
function makeNewsMenu(obj,nest){
nest=(!nest) ? "":'document.'+nest+'.'
this.css=bw.dom? document.getElem</div></div>

<div class="clearfix"></div>
                    </div>
                    <nav aria-label="...">
                        <ul class="pager">
                            <li class="previous"><a href="4667">上一篇：狡猾的按钮特效</a></li>

<li class="next"><a href="3438">下一篇：可随意拖动的图层</a></li>
                        </ul>
                    </nav>

<div class="alert alert-warning" role="alert">
                        <strong>免责声明：</strong> 本文仅代表作者个人观点，与爱易网无关。其原创性以及文中陈述文字和内容未经本站证实，对本文以及其中全部或者部分内容、文字的真实性、完整性、及时性本站不作任何保证或承诺，请读者仅作参考，并请自行核实相关内容。
                    </div>

<div class="col-md-6 col-xs-12">
                      <li class="articleAbout"><a href='/ItNews/34169' title='史上最严电话实名制9月实行 三大难题待解' target="_blank">
                        史上最严电话实名制9月实行 三大难题待解</a></li></div>
                   
                
                  <div class="col-md-6 col-xs-12">
                      <li class="articleAbout"><a href='/ItNews/34234' title='完美入股盛大：一桩各怀心事的交易' target="_blank">
                        完美入股盛大：一桩各怀心事的交易</a></li></div>
                   
                
                  <div class="col-md-6 col-xs-12">
                      <li class="articleAbout"><a href='/ItNews/34239' title='从WPS到office365，中国企业能否赶超美国？' target="_blank">
                        从WPS到office365，中国企业能否赶超美国？</a></li></div>
                   
                
                  <div class="col-md-6 col-xs-12">
                      <li class="articleAbout"><a href='/ItNews/10841' title='华为任正非：家族成员不会成为接班人' target="_blank">
                        华为任正非：家族成员不会成为接班人</a></li></div>
                   
                
                  <div class="col-md-6 col-xs-12">
                      <li class="articleAbout"><a href='/ItNews/34300' title='中移动将推出多项4G资费新政' target="_blank">
                        中移动将推出多项4G资费新政</a></li></div>
                   
                
                  <div class="col-md-6 col-xs-12">
                      <li class="articleAbout"><a href='/ItNews/34336' title='同样的背景，罗永浩和雷军到底有什么不同？' target="_blank">
                        同样的背景，罗永浩和雷军到底有什么不同？</a></li></div>
                   
                
                  <div class="col-md-6 col-xs-12">
                      <li class="articleAbout"><a href='/ItNews/34229' title='CSS控制字符长度和显示长度' target="_blank">
                        CSS控制字符长度和显示长度</a></li></div>
                   
                
                  <div class="col-md-6 col-xs-12">
                      <li class="articleAbout"><a href='/ItNews/16167' title='Kindle入华遭遇国内厂商“围剿 ” 电信也参战' target="_blank">
                        Kindle入华遭遇国内厂商“围剿 ” 电信也参战</a></li></div>
                   
                
                  <div class="col-md-6 col-xs-12">
                      <li class="articleAbout"><a href='/ItNews/34250' title='微信将商场O2O战火烧到了阿里巴巴老家' target="_blank">
                        微信将商场O2O战火烧到了阿里巴巴老家</a></li></div>
                   
                
        </ol>
    </div>
</div>

</div>

</div>
            </div>
            <div class="clearfix"></div>

<footer class=" footer navbar-bottom">
<em>友情链接：</em>
    
      <a href="http://www.aiyiweb.com/" target="_blank">爱易网 </a>            
    
      <a href="http://www.aiyiweb.com/" target="_blank">云虚拟主机技术 </a>            
    
      <a href="http://www.aiyiweb.com/" target="_blank">云服务器技术 </a>            
    
      <a href="http://www.aiyiweb.com/" target="_blank">程序设计技术 </a>            
    
      <a href="http://www.aiyiweb.com/" target="_blank">开发网站 </a>            
    
      <a href="http://www.aiyiweb.com/" target="_blank">APP开发教程 </a>            
    
<br />
<script type="text/javascript">(function(){document.write(unescape('%3Cdiv id="bdcs"%3E%3C/div%3E'));var bdcs = document.createElement('script');bdcs.type = 'text/javascript';bdcs.async = true;bdcs.src = 'http://znsv.baidu.com/customer_search/api/js?sid=15239353030108964139' + '&plate_url=' + encodeURIComponent(window.location.href) + '&t=' + Math.ceil(new Date()/3600000);var s = document.getElementsByTagName('script')[0];s.parentNode.insertBefore(bdcs, s);})();</script>

Copyright © 2013-2026 爱易网页 当前在线：2165人　
        网站在18时14分18秒内访问总人数：208166人
    当前 16.68%
　<a href="https://beian.miit.gov.cn" target="_blank">粤ICP备18100884号-2 </a>
<script charset="UTF-8" id="LA_COLLECT" src="//sdk.51.la/js-sdk-pro.min.js"></script>
<script>LA.init({ id: "JszEmKrtpbU59dY5", ck: "JszEmKrtpbU59dY5" })</script>

</footer>

</div>
   
</body>
</html>