js tab效果代码增强版_javascript技巧-js教程-PHP中文网

首页

web前端

js教程

js tab效果代码增强版_javascript技巧

WBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWB

May 16, 2016 pm 07:05 PM

jstab效果

table.TabBarLevel1 td{ 
border:1px solid #CCCCCC; 
height:20px; 
background-color:#E1E1E1; 
} 
table.TabBarLevel1 td.Selected{ 
border-bottom-width:0px; 
background-color:#ffffff; 
} 
table.TabBarLevel1 td.Black{ 
border-left-width:0px; 
border-top-width:0px; 
border-right-width:0px; 
background-color:#FFFFFF; 
} 
table.Content{ 
border-left:1px solid #CCCCCC; 
border-right:1px solid #CCCCCC; 
border-bottom:1px solid #CCCCCC; 
} 
</style> 
<table width="600" border="0" cellspacing="0" cellpadding="0"> 
<tr> 
    <td>
<table width="100%" border="0" cellspacing="0" cellpadding="0" class="TabBarLevel1" id="TabPage1"> 
      <tr align="center"> 
        <td width="130" id="imageTab1" valign="middle" class="mousehand" onclick="javascript:switchTab('TabPage1','imageTab1','心开风神','image');">热门图片</td> 
        <td width="7" class="Black"> </td> 
        <td width="80" id="imageTab2" valign="middle" class="mousehand" onclick="javascript:switchTab('TabPage1','imageTab2','子虚乌有','image');">波希米亚</td> 
        <td width="7" class="Black"> </td> 
        <td width="80" id="imageTab3" valign="middle" class="Selected mousehand" onclick="javascript:switchTab('TabPage1','imageTab3','孤零飘客','image');">红色黑客</td> 
        <td width="7" class="Black"> </td> 
        <td width="" align="right" class="Black">
<a href="http://www.jb51.net">脚本之家</a>  </td> 
      </tr> 
    </table> 
      <table width="100%" border="0" cellpadding="0" cellspacing="0" class="Content"> 
        <tr> 
          <td height="110"><div id="divimagelist_all"> 正在加载...</div></td> 
        </tr> 
      </table>
</td> 
</tr> 
</table> 
<script language="javascript"> 
function switchTab(tabpage,tabid,action,type){ 
    var oItem = document.getElementById(tabpage);    
    for(var i=1;i< 4;i++){ 
        var x = document.getElementById(type + 'Tab' + i);     
        //alert(x); 
        x.className = "mousehand"; 
        //var y = x.getElementsByTagName('a'); 
        //y[0].style.color="#333333"; 
    }     
    document.getElementById(tabid).className = "Selected"; 
    //gethotimagelist(type+'_'+action); 
    divimagelist_all.innerHTML = type+'_'+action; 
} 
</script>

[Ctrl+A 全选注:如需引入外部Js需刷新才能执行]

本人在它的基础上添加的内容控制的效果

复制代码代码如下:

<script> <BR>function $(objName) <BR>{ <br><br>    if(document.getElementById) <BR>    { <BR>        return document.getElementById(objName ); <BR>    } <BR>    else if(document.layers) <BR>    { <BR>        return eval("document.layers['" + objName +"']"); <BR>    } <BR>    else <BR>    { <BR>        return eval('document.all.' + objName); <BR>    } <BR>} <BR>function switchTab(tabpage,tabid,action,type){ <BR>    var oItem = $(tabpage);    <BR>    for(var i=1;i<6;i++){ <BR>        var x = $(type + 'Tab' + i);     <BR>        //alert(x); <BR>        x.className = "mousehand"; <BR>        //var y = x.getElementsByTagName('a'); <BR>        //y[0].style.color="#333333"; <BR>  }     <BR>    $(tabid).className = "Selected"; <BR>    //gethotimagelist(type+'_'+action); <BR>    closeall(action); <BR>    $(action).style.display="block"; <BR>} <BR>function closeall(action){ <BR>for(var ii=1; ii<5; ii++){ <BR>var noclose; <BR>noclose="div"+ii; <BR>if (noclose!=action){ <BR>$(noclose).style.display="none"; <BR>} <BR>} <BR>} <BR></script>

声明

本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系admin@php.cn

Python vs. JavaScript：开发人员的比较分析May 09, 2025 am 12:22 AM

Python和JavaScript的主要区别在于类型系统和应用场景。1.Python使用动态类型，适合科学计算和数据分析。2.JavaScript采用弱类型，广泛用于前端和全栈开发。两者在异步编程和性能优化上各有优势，选择时应根据项目需求决定。

Python vs. JavaScript：选择合适的工具May 08, 2025 am 12:10 AM

选择Python还是JavaScript取决于项目类型：1)数据科学和自动化任务选择Python；2)前端和全栈开发选择JavaScript。Python因其在数据处理和自动化方面的强大库而备受青睐，而JavaScript则因其在网页交互和全栈开发中的优势而不可或缺。

Python和JavaScript：了解每个的优势May 06, 2025 am 12:15 AM

Python和JavaScript各有优势，选择取决于项目需求和个人偏好。1.Python易学，语法简洁，适用于数据科学和后端开发，但执行速度较慢。2.JavaScript在前端开发中无处不在，异步编程能力强，Node.js使其适用于全栈开发，但语法可能复杂且易出错。

JavaScript的核心：它是在C还是C上构建的？May 05, 2025 am 12:07 AM

javascriptisnotbuiltoncorc; saninterpretedlanguagethatrunsonenginesoftenwritteninc.1）javascriptwasdesignedAsalightweight，解释edganguageforwebbrowsers.2）Enginesevolvedfromsimpleterterterpretpreterterterpretertestojitcompilerers，典型地提示。

JavaScript应用程序：从前端到后端May 04, 2025 am 12:12 AM

JavaScript可用于前端和后端开发。前端通过DOM操作增强用户体验，后端通过Node.js处理服务器任务。1.前端示例：改变网页文本内容。2.后端示例：创建Node.js服务器。

Python vs. JavaScript：您应该学到哪种语言？May 03, 2025 am 12:10 AM

选择Python还是JavaScript应基于职业发展、学习曲线和生态系统：1)职业发展：Python适合数据科学和后端开发，JavaScript适合前端和全栈开发。2)学习曲线：Python语法简洁，适合初学者；JavaScript语法灵活。3)生态系统：Python有丰富的科学计算库，JavaScript有强大的前端框架。

JavaScript框架：为现代网络开发提供动力May 02, 2025 am 12:04 AM

JavaScript框架的强大之处在于简化开发、提升用户体验和应用性能。选择框架时应考虑：1.项目规模和复杂度，2.团队经验，3.生态系统和社区支持。

JavaScript，C和浏览器之间的关系May 01, 2025 am 12:06 AM

引言我知道你可能会觉得奇怪，JavaScript、C 和浏览器之间到底有什么关系？它们之间看似毫无关联，但实际上，它们在现代网络开发中扮演着非常重要的角色。今天我们就来深入探讨一下这三者之间的紧密联系。通过这篇文章，你将了解到JavaScript如何在浏览器中运行，C 在浏览器引擎中的作用，以及它们如何共同推动网页的渲染和交互。JavaScript与浏览器的关系我们都知道，JavaScript是前端开发的核心语言，它直接在浏览器中运行，让网页变得生动有趣。你是否曾经想过，为什么JavaScr

See all articles