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.63738.com-足彩中奖怎么算奖金| www.200450.com-彩票走势图双色球| www.589787.com-双彩论坛字谜区| www.7rw.com-三地彩票布衣天下| www.495242.com-电竞体育竞猜博彩| www.584006.com-最准的彩票预测网站| www.732311.com-福彩中奖新闻| www.880650.com-一定牛甘肃福彩快三| www.985788.com-大发时时彩作弊神器| www.kx15.com-推荐私彩app| www.22uq.com-易算时时彩软件官网| www.2527.xyz-七星彩早版加急版| www.15294.com-简短描写彩虹的句子| www.005651.com-天天彩票下载到手机| www.133134.com-中国体育竞技彩票| www.259867.com-河南新快三一共几注| www.xv04.com-彩票赌博app| www.289308.com-乐彩网首页福彩| www.594495.com-七彩互联网科技| www.680803.com-彩票巴巴官网| www.772922.com-白菜彩金论坛| www.948214.com-特彩吧高手免资料| www.ag45.com-体彩排列3开奖结果| www.11uo.com-天津彩-| www.7638.cc-福彩双色球爱彩| www.933469.com-全国高频彩票app| www.jg63.com-8亿彩票登录| www.35eh.com-新乡2019彩票| www.30np.com-极速分分彩官方开奖| www.po48.com-胜负彩500彩票| www.067630.com-充值送彩金彩票平台| www.164529.com-71彩票是什么| www.4847.top-彩票式购物-| www.18012.com-竞彩怎样买才稳赚| www.006288.com-一会一开奖的彩票| www.162986.com-快三路数-| www.566645.com-凯发彩票官网| www.070781.com-3168彩票下载| www.292666.com-福彩新彩网-| www.411986.com-家彩网杀码3d| www.073888.com-彩6网页版-| www.801862.com-福利彩票双色球复式| www.916912.com-必赢彩票提现不到账| 大赢家彩票平台www.186957.com| www.2048.hk-易旺购彩大厅| www.ke82.com-山东福利彩票下载| www.631789.com-七彩阳光寓意| www.032753.com-七星乐彩的骗局| www.52275.cc-趣彩票-| www.029015.com-亿彩堂怎么下载| www.26077.cc-彩虹羽泉歌词意境| www.23116.cc-彩票尺寸-| www.472277.com-彩票小说彩票小说| www.4146.com-体彩排列三算法| www.9889.wang-什么部门管彩票站| www.40948.com-彩拾彩票官网| www.013066.com-七星彩第19035| www.096336.com-排列三杀号众彩网| www.187613.com-福彩时时彩开奖结果| www.266815.com-吉林快三一把一结| www.352867.com-热购彩票违法| www.455726.com-3d福彩图片第二版| www.567681.com-图谜总汇牛彩| www.683337.com-网上是否可以买彩票| www.768100.com-福利彩平台刷流水| www.855313.com-天天彩票软件正规吗| www.933311.com-时时彩小鹿开奖提醒| www.990751.com-好彩票软件| www.vb04.com-河南快三计划| www.761426.com-好彩妹叫什么| www.132430.com-平顶山结婚彩礼| www.265967.com-安微福利彩票开奖| www.62lc.com-双色球彩票开时间| www.029546.com-安徽快三怎么买| www.6688.xyz-团队快三计划在线| www.100559.com-乐彩客苹果版| www.234849.com-三d走势彩经网| www.112198.com-快三7点和值多少钱| www.148896.com-飞乐迷彩羽绒服| www.248342.com-彩票ios下载| www.734012.com-安徽竞彩快三| www.862142.com-七乐彩除8走势图| www.953225.com-时时彩后二杀号技巧| www.xv35.com-今日彩票晒票| www.560342.com-澳门快三有陷阱吗| www.658617.com-login中彩乐| www.747573.com-环彩网下载-| www.831350.com-中国福利彩票主任| www.933251.com-五省快三是哪五个| 博友彩www.412688.com| www.037195.com-瑞彩祥云下载软件| www.403511.com-七星彩计划网页版| www.548492.com-送彩金70-| www.631797.com-七彩什么意思| www.04kd.com-彩铅画乡村风景教程| www.1450.com-用彩色铅笔画画简单| www.630023.com-福彩好还是体彩| www.716873.com-鹿彩铅画教程图解| www.803868.com-海南七星彩彩版| www.880580.com-跳快三视频-| www.50mw.com-德国鲸彩漆价格| www.4962.vip-鸿运时时彩计划软件| www.31835.com-我想买彩票如何申请| www.030882.com-彩61下载网址| www.365311.cc-建行彩票站点缴费| www.508841.com-澳客彩票网开奖大厅| www.nn52.com-中国竞彩官网app| www.ur6.com-123手机彩票网| www.824120.com-三彩实体店-| www.910308.com-体彩排三千禧试机号| www.87qp.cc-手机彩膜是钢化膜吗| www.4364.cc-2007年福彩和值| www.17539.com-赢彩票是正规网站吗| www.912006.com-青蛙彩票开奖现直播| www.995043.com-惠赢彩票-| www.el38.com-彩票代打兼职靠谱| www.vd83.com-智慧彩软件-| www.302642.com-977彩票平台| www.701396.com-淘彩票注册官网| www.770552.com-豫彩通app官网| www.854091.com-蚂蚁积分买彩票| www.923197.com-亚盘竞彩转换| www.545070.com-福彩丹东全图图库| www.731067.com-新生分分彩官方网站| www.m46.org-福彩十分开奖| www.32zl.com-赚彩票佣金-| www.061040.com-彩票赚钱模式| 全民汇彩票www.52303s.com| www.671721.com-cb8彩宝彩票真假| www.719454.com-七星彩手机机选| www.804110.com-竞彩彩票骗人| www.33bu.com-体彩排三天庚图| www.239.cm-雅彩彩票安全吗| www.08kp.com-728down彩票| www.205666.com-98vip彩票网| www.325136.com-体彩解太湖字迷总汇| www.401855.com-7月30七星彩| www.281156.com-时时彩投资盈利技巧| www.471504.com-彩名堂下载计划软件| www.848874.com-重庆时时彩水果网| www.304176.com-彩之家app官网| www.403048.com-河北福彩好运3| www.516278.com-乐彩33软件可靠吗| www.590857.com-足彩妖刀推荐| www.690883.com-500彩票网斗牛牛| www.777793.com-中彩网3d开奖数据| www.985961.com-今天彩报图库| www.bf35.com-淘宝彩票一我的账户| www.zh53.com-七乐彩直播开奖| www.564533.com-放心的87彩店| www.389230.com-重庆时彩合法吗| www.513191.com-万博彩票维护延期| www.18wl.cc-体彩店微信代打| www.2641.vip-体彩一周开几次奖| www.623450.com-彩票分析家手机版| www.237038.com-竞彩m串n公式表| www.388899.com-福彩了3d交流群| www.608728.com-尚未派彩是什么意思| www.698579.com-黑龙江体彩6十一| www.893082.com-休育彩票排列五开奖| www.974589.com-众乐彩票app下载| www.fg86.com-快三过滤器-| www.298557.com-时时彩组三组六玩法| www.382092.com-智慧彩教程-|