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天

知道了
顺丰彩票 www.807386.com-彩博士计划软件官网| www.5989.cn-酷彩网快三-| www.854689.com-手机中国体彩网下载| www.271443.com-广东新彩王彩图| www.272221.com-投诉博牛彩票| www.370495.com-透明彩钢瓦图片| www.495351.com-国家彩票中奖上限| www.061013.com-快乐彩技巧稳赚| www.a33.cn-618彩票官方网站| www.vf03.com-彩票软件网站排行榜| www.237060.com-足彩比-| www.651018.com-水彩好看图片大全| www.850704.com-大乐透彩票截止时间| www.rk41.com-各种釉彩大瓶价值| www.957630.com-七彩乐透开奖| www.fm24.com-贵州体育彩票兑奖| www.25nz.com-骰子彩票有什么套路| www.521576.com-体彩彩票站加盟| www.931826.com-中彩网贺老师| www.334128.com-玩私彩-| www.495532.com-谁手机博彩过| www.623375.com-福彩天齐网字谜总汇| www.774162.com-十字彩官方网站| www.918998.com-万豪国际博彩| 恒彩www.hcw018.com| www.10cp.cc-中国体育彩票贴吧| www.9975.in-足彩大富翁媒体预测| www.370989.com-中彩网址大全| www.666151.com-体彩赚的钱用来干嘛| www.984521.com-彩8怎么下载| www.of23.com-网上买快彩的网站| www.61612.com-tt彩票app下载| www.568700.com-赛车彩票是真的吗| www.575840.com-为什么体彩停售| www.177763.com-北京快三官方网站| www.254431.com-山西福彩-| www.9306.top-免费彩票计划网站| www.154007.com-e彩堂江苏快3| www.334282.com-香港快三玩法技巧| www.129452.com-彩运来手机版下载| www.52872.com-福彩2d中奖多少钱| www.201.org-彩铅动物简单图片| www.70923.com-三度彩金论坛| www.061066.com-体彩三地试机号| www.182854.com-彩票小狂人看胆| www.539674.com-深圳福彩地址| www.267078.com-海南福利快三查询| www.230406.com-快三湖北-| www.304958.com-11选5彩票官方| www.57185.com-快八彩票下载| www.81229.cc-福彩3d倍投计划表| www.c47.win-今天福彩开奖结果| www.21367.com-今天竞彩足球跟单| www.623226.com-安宁区福彩中心楼| www.871131.com-七乐彩新浪走势图| www.3364.top-彩虹天团app官网| www.08383.com-快投彩票-| www.014570.com-今日7星彩预测号码| www.984798.com-足彩胜负奖金计算器| www.431722.com-91彩站联盟官网| www.cs24.com-瑞彩祥云软件下载| www.509583.com-腾讯分分彩号码统计| www.ip02.com-烟台福彩-| www.879369.com-福彩3d脑筋急转弯| www.955773.com-福彩3d出的什么号| 盛彩网www.41518v.com| www.jw70.com-彩库下载宝典| www.d02.cc-五洲彩票登录网址| www.33zl.com-网易彩票七星彩| www.0312.website高温釉上彩安全吗| 东方国际www.451117.com| www.6888.live-七彩花-| www.49751.com-5oo万彩票网官网| www.588043.com-手机现在怎么打彩票| www.974421.com-安徽快三号码统计表| www.24nc.com-手机彩膜图片原图| www.421982.com-新浪博客爱彩| www.875897.com-彩神8网址是多少| www.983409.com-中国福利彩票吧| www.66pe.com-梦见彩票数字好不好| www.9531.online百博七星彩投注| www.72854.com-中彩彩票怎么销户| www.34541.com-彩吧论谈-| www.199718.com-福建省体彩36| www.366305.com-彩铅切开橘子教程| www.625706.com-高兴彩票投注平台| www.6390.cc-鸣彩艺术-| www.482585.com-亿彩网娱乐-| www.568724.com-彩票扫码器软件下载| www.76792.com-体彩19018期| www.151571.com-福彩3字谜图迷汇总| www.dq91.com-快三全国统一吗| www.87314.com-933彩票软件最新| www.076677.com-广东体彩下载| www.990352.com-多乐彩票平台app| www.72295.cc-886彩票-| www.690602.com-500彩票网一首页| www.511.site-彩票开qq群拉人| www.586324.com-彩票机设备多少钱| www.688750.com-快三怎么分析大小球| www.056939.com-快三猜大小规则| www.122872.com-酷彩美国官网| www.203477.com-如何分析彩票走势图| www.316352.com-新浪爱彩合法吗| www.386323.com-彩票多ip解决方法| www.549631.com-在哪能买到足球彩票| www.267218.com-足球彩票十四场实弹| www.260896.com-山西快三走势图| www.3178.cm-k彩客服-| www.09095.com-天禧彩票骗局| www.120249.com-久久发彩票ios| www.780289.com-福彩站怎么赚钱| www.295900.com-查七星彩开奖结果| www.267982.com-手机在线山东体彩| www.79274.com-彩票网诈骗-| www.101966.com-彩票计划骗局| www.254072.com-华宇app彩票| www.432413.com-体彩二等奖去哪领奖| www.592004.com-彩票77苹果系统| www.900956.com-专业玩彩3d彩票网| www.hm79.com-买彩票赚钱-| www.2249.cn-夫下彩票免费大全| www.052173.com-高频彩票投注网站| www.23qa.com-七彩开什么奖七星彩| www.630889.com-体彩飞鱼中奖条件| www.ih6.com-浙江福彩快乐彩开奖| www.511415.com-彩库宝典现场开张| www.887332.com-双色球彩票字谜图迷| www.mz0.com-幸运快三最全走势图| www.qy41.com-腾讯分分彩计划软件| www.10gq.com-中国体彩网排三预测| www.176677.com-福彩快三有赚钱的吗| www.295411.com-彩吧吧全图-| www.749652.com-306时时彩下载| www.8528.in-网购时时彩-| www.828718.com-彩票站打错票能退吗| www.528571.com-凤凰微彩店-| www.763521.com-拼搏在线彩神通| www.966756.com-宝马彩票案焦点访谈| www.25893.cc-周杰伦彩虹-| www.057969.com-体育彩票提成怎么算| www.013815.com-局王七星彩图纸最新| www.65858.com-三分彩出号规律| www.dm80.com-福彩有快三的省份| www.36ag.com-体彩排列三跨度振幅| www.833916.com-好彩无嘴香烟| www.907206.com-快三全天助赢计划| www.ck45.com-河北廊坊快三走势图| www.62hp.com-名人彩票-登录页面| www.166583.com-今天广西快三开奖| www.199047.com-体育彩票怎么买法| www.352879.com-彩票软件为什么停售| www.494141.com-买几组彩票数字| www.597272.com-众亿彩票平台| www.513573.com-赢彩彩票y655| www.679712.com-巨龙彩票下载| www.956008.com-透视彩票破解软件| www.pl6.com-吉林省快三最大遗漏| www.612189.com-时时彩票吧-| www.729826.com-彩票专业分析| www.957458.com-北京单场体育彩票| 亿彩网www.296676.com| www.5878.vip-如何用彩分兑换彩票| www.791013.com-福彩福彩快3助手|