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.4342.live-四川绵阳福彩中心| www.92gf.com-87彩票店安全吗| 好彩网www.992599.com| www.qz67.com-分分快三假不假| www.751025.com-彩票刮刮卡上瘾| www.873060.com-彩票时时彩在哪里买| www.949249.com-查下福彩三d图谜| 福彩www.16878e.com| www.568560.com-昆明七彩云南楼盘| www.671708.com-香港生肖彩论坛| www.10365.com-竞彩足球完场比分| www.615989.com-渐江福彩-| www.6371.top-彩票有没有作假| www.52330.cc-快三投注倍投计划| www.014655.com-农村彩神专家专栏| www.663941.com-鸿运彩票投注站电话| www.519525.com-信彩彩票黑款| www.zd58.com-红牛彩app-| www.74nf.com-七星彩天狼星预测| www.8727.in-体彩竞彩软件| www.72487.com-网上购彩兼职可靠吗| www.279781.com-彩票时时乐开奖查询| www.730799.com-凤凰竞彩是真的吗| www.832930.com-彩78计划app| www.938992.com-澳客网彩票pc| 500彩票www.330831.com| www.82xx.com-3d多彩网字谜图迷| www.702599.com-明彩软件-| www.791494.com-京东竞彩是真的吗| www.153999.com-湖北快三共享走势图| www.xl98.com-福彩3d单一走势图| www.139720.com-足球竞彩下载| www.251884.com-旺彩app下载苹果| www.650716.com-小班彩虹伞说课演练| www.776155.com-亿万彩票平台| www.562795.com-体育彩票排列三中奖| www.12yp.com-辽宁体彩十一迭五| www.955119.com-开彩彩票-| www.cj7.com-怎样玩快三赚钱| www.113160.com-大奖网买彩票靠谱吗| www.99665.com-金福彩票黑吗| www.075550.com-一段话猜生肖的彩票| www.92va.com-天天中彩票的优惠卷| www.947599.com-于海彩票案真相| 财神网www.29277y.com| www.109081.com-网络彩票赌博害死人| www.580890.com-七乐彩旋转矩阵| www.830123.com-福利彩票3d幸运号| www.951976.com-彩神彩天下骗局| www.dv7.com-华夏幸运快三| www.566293.com-中彩票网官网| www.662031.com-福彩3d彩票老店主| www.6144.live-彩礼新规定2019| www.28273.cc-做时彩代理违法吗| www.57117.cc-彩宝彩票三分时时彩| www.6716.top-上饶福彩中心电话| www.41380.com-福利彩票手机怎么买| www.up12.com-7193鸿彩-| www.256803.com-苹果彩票app| www.875048.com-一张彩票的故事| www.79yo.com-彩票现在还能相信吗| www.515110.com-民权龙塘彩礼| www.166379.com-上海快三开奖最新| www.596058.com-彩票法律法规赊账| www.696135.com-新浪爱彩竞彩比分| www.784211.com-南京众彩市场| www.2451.org-spss彩票-| www.46fi.com-郑州体彩兑奖中心| www.021758.com-竞彩258下载| www.756951.com-体彩排三定胆杀码| www.841851.com-彩票站五行属性| www.915083.com-彩票天天乐是骗局吗| www.979342.com-江苏体彩投注器| www.db40.com-人人彩票76907| www.833119.com-彩九版本下载| www.324827.com-彩票图纸3d今天的| www.061539.com-彩客网完整手机版| www.06fb.com-3g门户彩票-| www.947246.com-福彩3第三天计划| www.723579.com-体彩5000万-| www.98xu.com-中国体彩三毛彩图片| www.226431.com-小游戏快三-| www.076566.com-彩票怎么买几个数| www.176136.com-江苏快三计划稳定网| www.319631.com-爱彩乐报警-| www.947280.com-1688彩吧官方群| www.jt66.com-快赢彩票手机客户端| www.11jv.com-打击越南时时彩| www.221575.com-瑞彩祥云v8-| www.527258.com-新时时彩的开奖结果| www.636080.com-彩虹六号墨冰稀有吗| www.nb17.com-彩票密码解密| www.35gn.com-南囯体彩-| www.200771.com-七星彩论坛精选| www.299608.com-陕西体彩爱彩乐| www.298316.com-我要查一下福利彩票| www.311719.com-官方江苏快三计划| www.791051.com-时时彩机器人价格| www.863029.com-19051胜负彩| www.915265.com-博盈彩票app下载| www.966562.com-澳洲五分彩app| 豪彩VIPwww.690104.com| www.js75.cc-全天五分时时彩计划| www.1281.in-彩票经销商回扣| www.194905.com-彩96-| www.44530.com-二手工地彩钢围挡| www.9420.in-华人娱乐彩票登录| www.005559.com-彩票app快三| www.305351.com-收购中奖彩票送礼| www.0333.com-11选五5爱彩乐| www.629650.com-幸运彩票版图| www.7557.loan-传销型彩票-| www.25731.cc-世界杯足球体育彩票| www.97xw.com-大运娱乐是黑彩吗| www.104076.com-马来西亚大万彩票| www.777.red-微彩娱乐是骗局揭秘| www.7918.vip-福利彩票开奖预测| www.30780.com-九鼎彩票-| www.320093.com-陕西百宝彩十分钟| www.437299.com-陕西彩票中奖的地区| www.279393.com-河南跑马彩票| www.8767.top-彩票3阳光探码图| www.408052.com-喜中七星彩二等奖| www.522396.com-有什么彩票是压大小| www.642325.com-旧版彩吧助手| www.717539.com-如何用彩铅画草地| www.555705.com-大华彩票无法提现| www.659806.com-梦删七星彩解梦大全| www.773815.com-地方彩种开奖| www.139084.com-盈彩网玩抄江苏快三| www.223220.com-贵州省体彩票| www.303162.com-好彩1复式投注| www.363545.com-湖南体彩兑奖中心| www.24464.com-彩铅星空画-| www.001800.com-双色球彩托真实故事| www.970930.com-3d字谜中彩网| www.062793.com-小米米彩票-| www.222157.com-福彩三地规律| www.287267.com-周口彩票大奖| www.095571.com-中彩吧是什么平台| www.192966.com-福彩8-| www.667159.com-七乐彩一等奖是多少| www.798844.com-时时彩胆码提取| www.892917.com-登陆全民彩票| www.983915.com-福彩天吉预测网| www.bg72.com-五分彩是全国统一吗| www.406664.com-彩客网比分直播首页| www.500711.cc-迷彩里面配什么颜色| www.621770.com-五福彩票安全吗| www.686994.com-中彩那天微型课视频| www.753266.com-d9彩票99269| www.811776.com-神仙姐姐断组彩搜网| www.889603.com-凤凰彩世界官网| www.951374.com-大通彩票导航| 818合彩www.www.9889hc.com| www.655543.com-福彩三地杀和尾| www.065877.com-一道彩虹歌词| www.887351.com-网上彩票算赌博不| www.397241.com-七星彩巨奖-| www.708722.com-所有网上彩票停售了| www.792070.com-粉百含彩吧-| www.873329.com-重庆体育彩票幸运| www.931990.com-699彩票下载安装| E彩堂www.43818f.com|