＞
设为首页
＞
收藏本站
＞
最新电影
首页
运营资讯
今日英语
图形图像
计算机技术
Asp编程
网站结构化
资源共享
休闲娱乐
访问新站
> 子栏目
Asp
|
Jsp
|
XML
|
XSL
|
Div+Css
|
自定义函数
|
数据库
|
脚本特效
您现在的位置：
首页
=>
后台技术
=>
div+css
订阅本栏目
超酷滑动门
时间： 2007-09-27 13:47:40 阅读次数：3471
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> <title>滑动门</title> <style media="screen" type="text/css"> <!-- *{font-size:12px;} html,body{margin:0;text-align:center;over-flow:hidden;height:100%;width:100%;} UL{list-style-type:none; margin:0px;} /* 标准盒模型 */ .ttl{height:18px;} .ctt{height:auto;padding:6px;clear:both} .w936{width:936px;margin:2px 0;clear:both;border:1px solid skyblue} /* TAB 切换效果 */ .tb_{background-color: #E6F2FF; background-image: url('http://www.dc18.com/images/barbg_tab.gif'); background-repeat: repeat-x;} .tb_ ul{height:24px;} .tb_ li{float:left;height: 24px;padding-top: 6px;width: 94px;cursor:pointer;} .normaltab { background-image:url('http://www.dc18.com/images/normal_tab.gif'); background-repeat: no-repeat; color:#1F3A87 ;} .hovertab { background-image: url('http://www.dc18.com/images/hover_tab.gif'); background-repeat: no-repeat; color:#1F3A87; font-weight:bold } .dis{display:block;} .undis{display:none;} --> </style> <script type="text/javascript" language="javascript"> <!-- function g(o){return document.getElementById(o);} function HoverLi(n) { //如果有N个标签,就将i<=N; //本功能非常OK,兼容IE7,FF,IE6;http://www.xiaogezi.cn/ [小鸽子]系列 for(var i=1;i<=6;i++){g('tb_'+i).className='normaltab';g('tbc_0'+i).className='undis';} g('tbc_0'+n).className='dis';g('tb_'+n).className='hovertab'; } //--> </script> </head> <body> <div class="w936"> <div id="tb_" class="tb_"> <ul> <li id="tb_1" class="hovertab" onmouseover="xgz:HoverLi(1);">网上房展会</li> <li id="tb_2" class="normaltab" onmouseover="xgz:HoverLi(2);">本月开盘</li> <li id="tb_3" class="normaltab" onmouseover="xgz:HoverLi(3);">知名开发商</li> <li id="tb_4" class="normaltab" onmouseover="xgz:HoverLi(4);">栏目导航</li> <li id="tb_5" class="normaltab" onmouseover="xgz:HoverLi(5);">栏目导航</li> <li id="tb_6" class="normaltab" onmouseover="xgz:HoverLi(6);">栏目导航</li> </ul> </div> <div class="ctt"> <div class="dis" id="tbc_01">内容1</div> <div class="undis" id="tbc_02">内容2</div> <div class="undis" id="tbc_03">内容3</div> <div class="undis" id="tbc_04">内容4</div> <div class="undis" id="tbc_05">内容5</div> <div class="undis" id="tbc_06">内容6</div> </div> </div> <hr author="http://xiaogezi.cn" style="color:red;" /> </body> </html>
提示：您可以先修改部分代码再运行
飞飞As~p技术乐园
站内搜索
：
标题
内容
下一篇
SPAN 和 DIV 的区别
上一篇
多点调用的 选项卡
本栏目最新
栏目最新列表
微软IE调试工具：SuperPreview for IE(ie6
精选15个国外最流行的CSS框架
CSS2 Media类型使用方法及简介（@Media）
浏览器排版/布局 图片下方出现空隙的问题
使用IE浏览器a链接失效（不能点击）的解决方
网站优化策划
栏目最新列表
增加网站外链的快速方法
网站上线前必做的30个检查
新的友情链接参考标准（没有google的PR情况
优化Google的AdSense广告的五个工具
王通讲SEO八大基础
站点最新
站点最新列表
微博推广的一些技巧
xhEditor v1.1.7 发布，
收集的一些轻量级非常实
50个新鲜兼容最新版本的
javascript中cookie的设
Excel中出现#VALUE!、#D
jquery插件:飞飞表情插件
十个使用HTML5开发的精彩
支持HTML5的浏览器有哪些
飞妮莫属:漫画：如何写出
历史最热10条信息
MIME介绍 及
[
1
] [
2
] [
3
]
巧用Google和迅雷来下载
Transact SQL 常
[
1
] [
2
]
VIA Rhine II Fast Ethe
电脑常用端
[
1
] [
2
] [
3
]
Do you get a kick out
十道羊皮卷 欣赏+mp3版+
每日一句：A friend and
每日一句：Theres no tu
经典__悟透JavaScript
相关文章
多点调用的 选项卡
超酷滑动门
支持xthml的滑门滑块
经典的选项卡/滑门显
相关专题
相关专题列表
同一个页面可以多次使用
支持xthml的滑门滑块效果
滑动门 三种简洁的Tab导
滑块切换效果菜单
滑块导航栏
滑块菜单导航
超酷滑动门
伟哥博客
西安房产
123最新电影
三四六四
关于站点
|
免责声明
|
联系站长
|
网站地图
|
陕ICP备07002804号
WEB技术QQ交流群：72840059
©2007 ffasp.com. 版权所有
