购物网站大全,推广运营,seo排名网,重庆app外包分享福州网论坛fuzhou99.com帖子页面的绝对定位浮动导航条返回顶部的JS效果#xff0c;点击导航条栏目会出现伸缩展开隐藏层特效#xff0c;当滚动滚动条时”返回顶部“隐藏按钮就会出现#xff0c;还有一些其他的特效功能#xff0c;这边不多说了#xff0c;如果需要可以…分享福州网论坛fuzhou99.com帖子页面的绝对定位浮动导航条返回顶部的JS效果点击导航条栏目会出现伸缩展开隐藏层特效当滚动滚动条时”返回顶部“隐藏按钮就会出现还有一些其他的特效功能这边不多说了如果需要可以自己复制代码试一下或者访问www.fuzhou99.com的帖子或列表页面查看演示。 !DOCTYPE html PUBLIC -//W3C//DTD XHTML 1.0 Transitional//EN http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd
html xmlnshttp://www.w3.org/1999/xhtml
head
meta http-equivContent-Type contenttext/html; charsetutf-8 /
title无标题文档/title
style typetext/css
body{ background-color:#bbac85;}
ul,li{ margin:0px; padding:0px; list-style:none;}
.navbox{ width:95px; height:auto;z-index:99; left:2px; bottom:5px;POSITION:fixed;_position:absolute; _margin-top:expression(document.documentElement.clientHeight-this.style.pixelHeightdocument.documentElement.scrollTop); font-family: 宋体;}
.mj_nav{ width:93px; height:auto; border:1px solid #806f5f; background-color:#f3f3f3; -webkit-border-radius:5px;-moz-border-radius:5px;border-radius:5px; padding-bottom:15px;}
.mj_nav_bt{ width:93px; height:30px; background-color:#806f5f; font-size:14px; font-weight:bold; line-height:30px; text-align:center; color:#fde399; margin-bottom:10px;}
.mj_nav_list{ width:83px; height:auto; padding:0px 5px;}
.nav_span{ display:block; width:68px; padding-left:15px; height:24px; line-height:24px; background-image:url(http://www.fuzhou99.com/img/mjnav.gif); background-repeat:no-repeat; background-position:5px 8px; color:#594d42; font-size:14px; cursor: pointer;}
.mj_sn{ background-position:5px -12px;}
.mj_nav_list ul{ width:68px; height:auto; padding:0px 0px 15px 15px; display:none;}
.mj_nav_list li{ width:68px; height:24px; line-height:24px; font-size:14px; overflow:hidden;}
.mj_nav_list li a{ color:#0a57b7; text-decoration: underline;}
.mj_nav_list li a:hover{ color: #FF6600;}
.guanbi,.gotop{ width:93px; height:30px; line-height:30px; border:1px solid #806f5f; background-color:#f3f3f3; -webkit-border-radius:5px;-moz-border-radius:5px;border-radius:5px; text-align:center; font-size:14px; color:#594d42; margin-top:3px; cursor: pointer;}
.gotop{ display:none;}.zhangkai{ width:20px; height:auto; padding:10px 5px; line-height:20px; font-size:14px; text-align:center;-webkit-border-radius:0px 5px 5px 0px;-moz-border-radius:0px 5px 5px 0px;border-radius:0px 5px 5px 0px; border:1px solid #806f5f; background-color:#f3f3f3; POSITION:fixed;_position:absolute; _margin-top:expression(document.documentElement.clientHeight-this.style.pixelHeightdocument.documentElement.scrollTop); z-index:100; left:0px; bottom:150px; display:none; cursor: pointer; color:#594d42;}
.xx{ height:1000px;}
/stylescript typetext/javascript srchttp://jqueryjs.googlecode.com/files/jquery-1.2.6.min.js/script
script typetext/javascript$(document).ready(function(){$(.mj_nav_list span).click(function(){$(.mj_nav_list span).not($(this)).removeClass(mj_sn);$(this).toggleClass(mj_sn);$(.mj_nav_list ul).not($(this).next()).slideUp();$(this).next().slideToggle(500);//$(this).next().toggle();});$(window).scroll(function(){if ( $(window).scrollTop() 50 ){$(.gotop).fadeIn(800);} else {$(.gotop).fadeOut(500);};});$(.gotop).click(function(){$(window).scrollTop(0);});$(.guanbi).click(function(){$(.navbox).hide();$(.zhangkai).show();});$(.zhangkai).click(function(){$(this).hide();$(.navbox).show(500);});});/script
/headbody
div classnavbox
div classmj_nav
div classmj_nav_bt论坛导航/div
div classmj_nav_list
span classnav_span福州论坛/span
ul
lia hrefhttp://www.fuzhou99.com/forum-2-1.html title福州论坛-福州BBS福州论坛/a/li
lia hrefhttp://www.fuzhou99.com/forum-30-1.html title福州夜店论坛-福州酒吧论坛酒吧\夜店论坛/a/li
lia hrefhttp://www.fuzhou99.com/forum-9-1.html title福州活动论坛-户外活动|聚会活动|公益活动活动召集/a/li
lia hrefhttp://www.fuzhou99.com/forum-8-1.html title福州交友论坛-找男友、找女友福州交友/a/li
lia hrefhttp://www.fuzhou99.com/forum-15-1.html title福州电影院-福州电影爱好者交流论坛福州电影院/a/li
lia hrefhttp://www.fuzhou99.com/forum-33-1.html title福州宠物论坛-福州宠友俱乐部宠物论坛/a/li
lia hrefhttp://www.fuzhou99.com/forum-35-1.html title福州大利嘉城论坛-福州大利嘉城IT数码情报论坛大利嘉论坛/a/li
lia hrefhttp://www.fuzhou99.com/forum-16-1.html title心理测试心理测试/a/li
lia hrefhttp://www.fuzhou99.com/forum-17-1.html title笑话吧笑话吧/a/li
lia hrefhttp://www.fuzhou99.com/forum-29-1.html title福州彩票论坛-体彩论坛、福彩论坛彩票论坛/a/li
lia hrefhttp://www.fuzhou99.com/forum-25-1.html title股票论坛股票论坛/a/li
lia hrefhttp://www.fuzhou99.com/forum-26-1.html title电脑论坛电脑论坛/a/li
lia hrefhttp://www.fuzhou99.com/forum-31-1.html title福州公交论坛-的士论坛福州公交/a/li
/ul
/divdiv classmj_nav_list
span classnav_span分类信息/span
ul
lia hrefhttp://www.fuzhou99.com/forum-22-1.html title福州房屋出租房屋出租/a/li
lia hrefhttp://www.fuzhou99.com/forum-18-1.html title福州招聘求职-福州人才网招聘求职/a/li
lia hrefhttp://www.fuzhou99.com/forum-23-1.html title福州二手交易市场二手交易市场/a/li
lia hrefhttp://www.fuzhou99.com/forum-7-1.html title福州商家优惠打折促销信息商家优惠促销信息/a/li
lia hrefhttp://www.fuzhou99.com/forum-19-1.html title福州订餐网福州订餐/a/li
lia hrefhttp://www.fuzhou99.com/forum-24-1.html title福州团购活动团购活动/a/li
lia hrefhttp://www.fuzhou99.com/forum-20-1.html title福州综合服务综合服务/a/li
lia hrefhttp://www.fuzhou99.com/forum-34-1.html title福州拼车网-福州拼车论坛福州拼车/a/li
lia hrefhttp://www.fuzhou99.com/forum-28-1.html title福州商家通讯录-福州黄页商家通讯录/a/li
/ul
/divdiv classmj_nav_list
span classnav_span八县论坛/span
ul
lia hrefhttp://www.fuzhou99.com/forum-4-1.html title福清论坛福清论坛/a/li
lia hrefhttp://www.fuzhou99.com/forum-5-1.html title长乐论坛长乐论坛/a/li
lia hrefhttp://www.fuzhou99.com/forum-6-1.html title平潭论坛平潭论坛/a/li
lia hrefhttp://www.fuzhou99.com/forum-10-1.html title连江论坛连江论坛/a/li
lia hrefhttp://www.fuzhou99.com/forum-11-1.html title闽候论坛闽候论坛/a/li
lia hrefhttp://www.fuzhou99.com/forum-12-1.html title闽清论坛-梅城论坛闽清论坛/a/li
lia hrefhttp://www.fuzhou99.com/forum-13-1.html title罗源论坛罗源论坛/a/li
lia hrefhttp://www.fuzhou99.com/forum-14-1.html title永泰论坛永泰论坛/a/li
/ul
/div
/divdiv classgotop返回顶部/div
div classguanbi点击关闭/div
/divdiv classzhangkai论坛栏目导航/div
div classxx/div
/body
/html
