QQ客服
当前位置 : 首页 > 代码 > 网页特效 > 选项卡/滑动门 > jQuery tab选项卡排行榜切换代码

原创商用 jQuery tab选项卡排行榜切换代码

jQuery制作tab选项卡和图文排行榜列表切换,适用于畅销小说和商品销量排行榜切换代码。
分享到微信朋友圈
X
[声明]该素材是本站付费买断的作品代码,享受著作权保护,未经允许请勿转载,否则追究相应的法律责任。

使用方法:

1、head引入css文件

<link type="text/css" href="css/style.css" rel="stylesheet" />

2、head引入js文件

<script type="text/javascript" src="js/jquery.min.js"></script>
<script type="text/javascript" src="js/jquery.SuperSlide.2.1.1.js"></script>

3、body引入HTML代码

<dl class="tab-rank">

	<dt class="hd">
		<h3 class="on"><a href="#">会员活动</a></h3>
		<h3><a href="#">经验分享</a></h3> 
	</dt> 
	
	<dd class="bd"> 
		<ul class="ulList"> 
			<li class="t on">
				<span class="num">1</span> 
				<div class="c"> 
					<div class="pubpic">
						<a href="#"><img src="images/1.jpg" /></a>
					</div> 
					<div class="pubtitle">
						<a href="#">品桃花,赢好礼</a>
						<p>2013/02/15—2013/03/15</p>
					</div> 
				</div>
			</li> 
			<li class="t">
				<span class="num">2</span> 
				<div class="c"> 
					<div class="pubpic">
						<a href="#"><img src="images/2.jpg" /></a>
					</div> 
					<div class="pubtitle">
						<a href="#">中华儿女孝心行动---“熬胶孝敬..</a>
						<p>2012/02/02—2012/02/28</p>
					</div> 
				</div>
			</li> 
			<li class="t">
				<span class="num">3</span> 
				<div class="c"> 
					<div class="pubpic">
						<a href="#"><img src="images/3.jpg" /></a>
					</div> 
					<div class="pubtitle">
						<a href="#">中国贫血关爱行动——复方阿胶浆..</a>
						<p>2012/09/01—2012/09/30</p>
					</div> 
				</div>
			</li> 
			<li>
				<span class="num">4</span> 
				<div class="c"> 
					<div class="pubpic">
						<a href="#"><img src="images/4.jpg" /></a>
					</div> 
					<div class="pubtitle">
						<a href="#">阿胶糕进厨房,健康美丽吃出来</a>
						<p>2012/10/15—2012/12/31</p>
					</div> 
				</div> 
			</li> 
			<li>
				<span class="num">5</span> 
				<div class="c"> 
					<div class="pubpic">
						<a href="#"><img src="images/5.jpg" /></a>
					</div> 
					<div class="pubtitle">
						<a href="#">桃花姬阿胶糕,阿胶达人免费申领..</a>
						<p>2011/04/01—2011/04/25</p> 
					</div> 
				</div></li> 
			<li>
				<span class="num">6</span> 
				<div class="c"> 
					<div class="pubpic">
						<a href="#"><img src="images/6.jpg" /></a>
					</div> 
					<div class="pubtitle">
						<a href="#">秋冬滋补进行时,免费品尝东阿阿..</a>
						<p>2012/09/16—2012/11/30</p>
					</div> 
				</div>
			</li> 
		</ul> 
		
		<ul class="ulList2"> 
			<li class="t">
				<div class="pic">
					<img src="images/1.jpg" />
				</div>
				<div class="con">
					<div class="title">
						<a href="#">解密杨贵妃的倾城容颜,探寻阿胶文化的源远流长!</a>
					</div>
				</div>
			</li> 
			<li class="n">
				<div class="pic">
					<img src="images/1.jpg" />
				</div>
				<div class="con">
					<div class="title">
						<a href="#">阿胶文化之旅,探寻阿胶滋补的秘密!!</a>
					</div>
				</div>
			</li> 
			<li class="n">
				<div class="pic">
					<img src="images/1.jpg" />
				</div>
				<div class="con">
					<div class="title">
						<a href="#">天天吃鸡蛋不利女性健康</a>
					</div>
				</div>
			</li> 
			<li class="n">
				<div class="pic">
					<img src="images/1.jpg" />
				</div>
				<div class="con">
					<div class="title">
						<a href="#">樱桃可治疗贫血带来的妇科病</a>
					</div>
				</div>
			</li> 
			<li class="n">
				<div class="pic">
					<img src="images/1.jpg" />
				</div>
				<div class="con">
					<div class="title">
						<a href="#">桃花姬——吃出好身体,吃出好容颜</a>
					</div>
				</div>

			</li> 
			<li class="n last">
				<div class="pic">
					<img src="images/1.jpg" />
				</div>
				<div class="con">
					<div class="title">
						<a href="#">桃花伊面春常驻,阿胶养容润枯颜</a>
					</div>
				</div>
			</li> 
		</ul>
	</dd> 
</dl> 
 
<script type="text/javascript">
jQuery(".tab-rank li").hover(function(){ jQuery(this).addClass("on").siblings().removeClass("on")},function(){ });
jQuery(".tab-rank").slide({ titCell:"dt h3", mainCell:"dd",autoPlay:false,effect:"left",delayTime:300 });
</script> 
[声明]本站素材来自用户分享,仅限学习交流请勿用于商业用途。如损害你的权益请联系客服QQ:2447402004给予处理。
举报×
举报原因:

相关代码

二维码
意见反馈
×
×

注册

QQ注册 立即下载 新浪注册 立即下载

签到成功!

已连续签到1天,签到3天将获得积分VIP1天

知道了
彩01彩票 www.212915.com-搭建网络时时彩平台| www.kj96.cc-彩票双色球模拟选号| www.199041.com-快三福彩是真的吗| www.233200.com-福利彩票机选| www.978755.com-好彩1开奖走势| www.52861.cc-开空彩票-| www.333041.com-买彩票中奖技巧| www.513907.com-竞彩总进球数技巧| www.82803.com-腾讯分分彩开奖号| www.147367.com-各种彩票开奖号码| www.am39.cc-福彩3d旧版走势图| www.06xp.com-彼岸花图片彩铅画| www.97ih.com-人生是不是该有彩排| www.6752.top-湖北快快三计划软件| www.936288.com-聚宝盆最大手机彩票| www.361626.com-杏彩论坛-| www.111493.com-新盈彩官网-| www.220811.com-8888彩票大骗局| www.142438.com-爱乐彩票app下载| www.267860.com-大发时时彩计划软件| www.383634.com-福利彩票开奖电视台| www.607352.com-中国中彩票大奖的人| www.5228.biz-彩票带赚包赔| www.78uq.com-和差福彩3d-| 大赢家彩票www.394311.com| www.436939.com-2356彩票-| www.622863.com-河南福彩大厦地址| www.004091.com-动物彩票技巧| www.m10.website七乐彩幸运快3| www.598484.com-七星彩走势图500| www.jw0.com-快三二同号技巧| www.632361.com-时彩回龙门投注法| www.3636.net-篮彩有什么app| www.609565.com-柬埔寨5分彩官网| www.3790.cc-全国体彩排列5预测| www.236787.com-福利彩票兑奖期限| www.257781.com-709彩票网官网| www.311149.com-快彩在线主页| www.24694.cc-彩铅鲸鱼画-| www.69882.com-足球彩票怎样看| www.93176.cc-玩快三怎么赚钱| www.145097.com-今日足彩-| www.754718.com-快三走势软件下载| www.731767.com-8k彩票哪里下| www.377826.com-福利彩票站几点开门| www.598629.com-98彩票网北京赛车| www.718678.com-彩虹在爱情里的含义| www.833622.com-福彩复式中奖查询表| 500彩票网www.65707y.com| www.vm68.com-福彩快三改革| www.796396.com-博乐彩票骗局| www.940079.com-吉林快三部落| www.cp6008.com-福彩3d跨度-| www.575169.com-福彩3d33期开奖| www.657654.com-体彩7星彩码020| www.0166.biz-福彩诈骗-| www.042605.com-多彩贵州网招聘| www.561654.com-买彩网是干嘛的| www.035515.com-彩票大数据软件| www.159035.com-网易彩票机选大乐透| www.254466.com-旺彩彩票是真的吗| www.683568.com-体彩助手客户端| www.913546.com-台湾福彩开奖现场| 豪彩VIPwww.912278.com| www.xj76.com-福利彩票怎么算倍数| www.ff49.cc-内蒙快三玩法技巧| www.534736.com-2元彩-| www.655772.com-爱彩彩网下载| www.2465.net-福彩3d字谜双彩| www.756520.com-彩易网字谜图谜大全| www.750462.com-福彩报纸在哪里订| www.309520.com-附近福利彩票站| www.237397.com-足彩竞猜结果| www.353001.com-台湾福星彩图片玄机| www.444887.com-应聘彩票销售员| www.535149.com-彩票王最新版下载| www.tu5.cc-360彩票手机版| www.210689.com-快三代理好做吗| www.828645.com-英国彩票种类| www.913369.com-福彩吧提款失败| 大赢家彩票平台www.082710.com| www.867229.com-中国体彩下载一定牛| www.974934.com-彩票查询结果七星彩| www.75975.com-废旧彩票回收| www.53162.cc-中国福彩排列3| www.072588.cc-彩票星期几可以买| www.196603.com-博彩app下载| www.4366.top-568专业彩票平台| www.531850.com-大学生彩票事件| www.874917.com-有游彩票-| www.952564.com-福彩短信投注指令| 亿万彩票www.345897.com| www.kt74.com-内蒙古快三时时彩| 500万彩票www.583792.com| www.33ox.com-七星彩2277期测| www.18670.com-查今晚体彩36开奖| www.993649.com-足彩任九定胆技巧| www.gj44.com-福彩一分快三| www.zj46.com-聚鑫网彩票是真的吗| www.367003.com-成都三彩家-| www.487920.com-金辰彩业-| www.316971.com-广东时时彩快乐十分| www.821550.com-佩奇彩票网快三| www.965372.com-彩票可以无限追吗| www.un34.com-彩宝彩票是骗局吗| www.68kk.com-南京体彩网彩票| www.6162.net-81彩票全天计划| www.21114.com-彩票有套路吗| www.122449.com-微信代买彩票合法吗| www.7789.cm-法贝热彩蛋哪里买| www.311240.com-五福彩票网站五福彩| www.301355.com-江苏快三开下载安装| www.339421.com-深圳体彩投注站| www.092570.com-福建体彩网app| www.re71.com-168彩票是真的吗| www.305766.com-易彩是真的吗| www.77291.cc-彩客网网页版| www.219308.com-湖北快三豹子走势图| www.361487.com-彩吧论坛3d下载| www.115756.com-彩乐乐大乐透走势图| www.44hb.com-区块链彩票可以玩吗| www.503833.com-博雅彩-| www.398312.com-摇摇乐彩票破解| www.686.online-马丽萍经营福彩| www.iu19.com-彩票大赢家软件下载| www.51188.com-国丰彩票app| www.20608.com-新345彩票-| www.316869.com-福彩图片大全| www.398100.com-今日3d彩报图谜总| www.338246.com-大家乐彩票是真的吗| www.707520.com-时时彩送彩金27| www.782826.com-鸿运彩票平台安全吗| www.848644.com-新加坡福彩救世报| www.904710.com-福彩快3投注网| www.959478.com-易彩网广西快3开挂| 凤凰彩票www.88266v.com| www.087895.com-彩票拉人-| www.87776.com-微信五分彩是真的吗| www.xx37.com-怎样才能刮彩票中奖| www.35yg.com-九亿彩票安全吗| www.723504.com-常州体彩中奖| www.797972.com-博彩源码交易| www.999183.com-鸿运彩票是正规的吗| www.112558.com-天下彩d45-| www.110460.com-福彩3d代码选号法| www.196975.com-彩经网排列三| www.306643.com-今天彩票买什么号| www.0xj.com-天天彩应用下载| www.964968.com-体彩摇奖现场直播| www.qx5.com-彩票台北快三正规吗| www.456731.com-竞彩篮球直播吧| www.245239.com-吉林快三倍投计算器| www.515773.com-扬州彩票案件结果| www.598508.com-今天七星彩号码多少| www.46370.cc-500万彩票店提成| www.725329.com-赌体育彩票犯法吗| www.793186.com-福利彩票去哪里领奖| www.860145.com-时时彩票是合法的吗| www.909218.com-福彩三b家彩网| www.956783.com-彩泥图-| www.993619.com-竞彩之家官网下载| www.ym.cc-江苏福彩快三下载| www.in33.com-10086移动彩票| www.220246.com-炫乐彩票app官网|