<html>
<head>
<title>滑动门效果</title>
<meta http-equiv="content-type" content="text/html;charset=utf-8">
<!--把下面代码加到<head>与</head>之间-->
<style type="text/css">
*{font:12px "宋体";margin:0;padding:0;}
ul{list-style:none;}
a{text-decoration:none;}
a:hover{text-decoration:underline;}
.TabADS{width:160px;}
.TabADS ul{width:160px;height:24px;background:#fff;}
.TabADS li{width:40px;float:left;height:18px;padding:6px 0 0 0;background:url(http://dl.iteye.com/upload/picture/pic/63606/79be4821-1960-32d0-8f2f-72a0e9d4abb1.gif) no-repeat right #e4e4e4;text-align:center;color:#333;cursor:pointer;}
.TabADS .TasADSOn{background:url(http://ueaner.iteye.com/upload/picture/pic/63604/1177d8b9-cbf8-3fd2-9eda-0a9cf77958f7.gif) no-repeat right #ffe4a6;text-align:center;color:#333;font-weight:bold;cursor:pointer;}
.TabADSCon{background:#FFD77B;padding:5px;width:150px;}
.TabADSCon li{text-align:left;line-height:20px;}
</style>
<script language="javascript" type="text/javascript">
function Show_TabADSMenu(tabadid_num,tabadnum){
for(var i=0;i<4;i++){document.getElementById("tabadcontent_"+tabadid_num+i).style.display="none";}
for(var i=0;i<4;i++){document.getElementById("tabadmenu_"+tabadid_num+i).className="";}
document.getElementById("tabadmenu_"+tabadid_num+tabadnum).className="TasADSOn";
document.getElementById("tabadcontent_"+tabadid_num+tabadnum).style.display="block";
}
</script>
</head>
<body>
<!--把下面代码加到<body>与</body>之间-->
<div class="TabADS">
<ul>
<li id="tabadmenu_10" onmouseover="setTimeout('Show_TabADSMenu(1,0)',200);" class="TasADSOn">VB</li>
<li id="tabadmenu_11" onmouseover="setTimeout('Show_TabADSMenu(1,1)',200);">ASP</li>
<li id="tabadmenu_12" onmouseover="setTimeout('Show_TabADSMenu(1,2)',200);">PHP</li>
<li id="tabadmenu_13" onmouseover="setTimeout('Show_TabADSMenu(1,3)',200);">cgi</li>
</ul>
</div>
<div class="TabADSCon">
<ul id="tabadcontent_10">
<li><a href="#" target="_blank">基于VC的推箱子游戏</a></li>
</ul>
<ul id="tabadcontent_11" style="display:none;">
<li><a href="#" target="_blank">VB批量重命名程序</a></li>
</ul>
<ul id="tabadcontent_12" style="display:none;">
<li><a href="#" target="_blank">VC++五子棋游戏进阶版源码</a></li>
</ul>
<ul id="tabadcontent_13" style="display:none;">
<li><a href="#" target="_blank">精美多模式DELPHI闹钟程序</a></li>
</ul>
</div>
</body>
</html>
分享到:
相关推荐
js滑动门代码制作js滑动门导航鼠标滑过滑动门效果 js滑动门代码制作js滑动门导航鼠标滑过滑动门效果 js滑动门代码制作js滑动门导航鼠标滑过滑动门效果 js滑动门代码制作js滑动门导航鼠标滑过滑动门效果
滑动门效果,基于CSS和简单的JS,有什么不足之处,请联系本人cslgsja@126.com
滑动门效果 采用js和css结合的方式!
滑动门效果 鼠标滑动菜单 页签效果 js 滑动门
Js 滑动门 英文字母切换 仿淘宝购物索引效果Js 滑动门 英文字母切换 仿淘宝购物索引效果
原生js鼠标悬停图标菜单滑动门显示效果 原生js鼠标悬停图标菜单滑动门显示效果 原生js鼠标悬停图标菜单滑动门显示效果 原生js鼠标悬停图标菜单滑动门显示效果
一个很好的jquery 滑动门效果,可以做导航,或者图片切换,很简单,很实用!
图片切换 幻灯片效果 滑动门 图片切换 幻灯片效果 滑动门 相当漂亮!图片切换 幻灯片效果 滑动门
简单的Js漂亮滑动门效果,简单易用,内含说明文件和html运行文件。
HTML调用JS实现多项滑动门选项卡特效 国开电大Dreamweaver网页设计形考任务八答案, 更新版国家开放大学/电大专科《Dreamweaver网页设计》形考任务八。
这是一个简洁实用的CSS+JavaScript滑动门导航菜单,写时候,我尽量用最少的代码写出兼容性好的代码,希望这款滑动门大家能够喜欢,也希望研究JS的达人一同切磋,共同提高。 运行效果截图如下: 在线演示地址如下: ...
Js滑动门 英文字母切换 仿淘宝购物索引效果 Js滑动门,英文字母切换,仿淘宝购物索引效果,实际上是一个特别的修改菜单,淘宝购物有一个分类导航和这个效果是类似的,效果不错,希望大家喜欢。
滑动门、html、css、js,自己使用,下载的http://www.cnblogs.com/binyong/
左右可伸缩滑动门效果
QuickMenuCSS 网页导航效果 网页滑动门效果 导航样式
主要为大家详细介绍了js实现滑动门效果的相关代码,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
JS滑动门_JS tab标签页效果大合集 含有新浪 腾讯财经 雅虎等多家站点的滑动门js特效
左右可伸缩滑动门漂亮效果(js 源码) JQuery,div+css,网页特效,广告设计
网易雅虎滑动门效果