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天

知道了
亚洲28 www.166049.com-快三是什么意思| www.014618.com-七星彩内部软件| www.314.cc-众赢彩票团队李胜| www.190578.com-中原彩票一分快三| www.xw02.cc-凤凰彩票pk10| www.803904.com-今日儋州七星彩| www.932388.com-彩妆美容化妆| www.cai2655.com安徽快三投注买网| www.7466.org-便利店接入彩票| www.555515.cc-彩神高手论擅| www.661221.com-中国彩吧彩吧论坛| www.753569.com-s9彩票-| 凤凰彩票www.66652b.com| www.291191.com-彩票近500期走势| www.382129.com-智慧彩挂机软件客服| www.461456.com-网易彩票今天老黄历| www.5440.in-双色球杀号新浪爱彩| www.15hp.com-腾讯时时彩二期计划| www.128793.com-国家福利彩票的种类| www.005189.com-七星彩明月珰番外二| www.9163.com-洛神体彩店下载| www.st74.com-体彩19031期| www.884981.com-今日七星彩预测号码| www.967859.com-探探男彩票托同款| www.cz97.com-彩神vl预测-| www.xv37.com-335彩票软件下载| www.308535.com-辽宁省福利彩票中心| www.399767.com-海南有几种彩票| www.576699.com-最大福彩论坛| www.649630.com-博彩业属于金融业吗| www.730399.com-竞彩大小球哪里买| www.820411.com-足彩即时指数| www.5337.top-福彩十五选五的玩法| www.21978.com-d58cc赢彩彩票| www.892081.com-腾讯分分彩规律技巧| www.979849.com-彩票导航免费网址| www.qy75.com-一分时时彩是哪开奖| www.231848.com-湖北快三新规| www.623052.com-福彩排列三开机号| www.803939.com-红旗彩票合法吗| www.598337.com-七星彩19037| www.254212.com-手机时时彩网投平台| www.356160.com-中国体彩属于企业| www.552753.com-七星彩开奖电视台| www.268672.com-竞彩猫杨震-| www.413999.com-叠彩区-| www.32206.com-易彩8位邀请码| www.848827.com-皇家时时彩安卓| www.939258.com-下载福彩网站的网址| 中彩网www.71233d.com| www.486266.com-百事网彩-| www.015498.com-七星彩机选号码器| www.385678.com-易算时时彩软件官网| www.753795.com-彩乐园lli-| www.822337.com-福利彩票分析| www.432050.com-彩票行家免费资料| www.077020.com-美国彩票最大奖| www.197120.com-七彩奖开奖结果| www.271778.com-好彩2复式注数计算| www.354824.com-体彩网彩民故事| www.436419.com-星彩惨无桃屋| www.754996.com-天津彩票官方开奖| www.851881.com-爱彩乐11选五辽宁| www.910163.com-汤姆克兰西彩虹六号| www.968411.com-澳洲时时彩开奖查询| 彩票5www.550214.com| www.gg63.com-日彩网快三是合法的| www.vq92.com-福彩开奖直播直播| www.274782.com-有人玩极速时时彩吗| www.532560.com-临沂市体彩中心地址| www.964378.com-竞彩足球怎么| 大赢家彩票平台www.210793.com| www.fq18.com-uu快三总输-| www.wp69.com-3d直选杀号彩经网| www.19va.com-彩仙阁挂机app| www.82vr.com-购乐彩网-| www.1284.xyz-乐彩网邀请码多少| www.361575.com-东方彩票真的假的| www.445052.com-怎么样才能中彩票| www.530549.cc-时时彩输了想死了| www.383962.com-五六彩票-| www.000918.com-竞彩篮球彩票怎么买| www.27gn.com-中国体彩排列三开况| www.2302.vip-微彩彩票怎么充值| www.037782.com-l乐彩娱乐计划助手| www.21913.cc-什么叫刷彩-| www.5706.me-三彩专柜怎么样| www.45mb.com-中博彩票被骗| www.49vr.com-竞彩足球官方下载| www.847.cm-二六八彩票-| www.36654.com-澳门发行哪些彩票| www.bq73.com-那个彩票网站倍率高| www.571150.com-青蛙彩票123| www.120863.com-福彩历史开奖查洵| www.04178.cc-微信彩友团出票| www.769650.com-福建好彩头-| www.6494.com-开心彩票官网| www.943887.com-彩票99苹果户端| www.gh73.com-三分快三计划准吗| www.54tk.cc-江西福彩银行| www.741100.com-体彩末位淘汰| www.98347.com-天天分分彩走势图| www.20tv.com-大智慧彩票概念| www.102702.com-手机上玩幸运彩票| www.298113.com-福利彩票速查表| www.fj89.com-五分快三好彩网计划| www.986638.com-体彩排3和值速查表| www.51pz.com-足彩米字什么意思| www.1966.top-3d牛彩涂谜九| www.093220.com-福彩开奖公告号码| www.171687.com-河北快三遗漏统计表| www.365021.com-淘彩是什么东西| www.127543.com-彩虹宝宝歌词| www.136137.com-体彩竞猜世界杯| www.236727.com-105彩票网址| www.46954.com-中华彩票电子报纸| www.7526.biz-彩票假的离谱| www.2781.vip-3b彩报-| www.97db.com-75秒时时彩计划群| www.375008.com-彩票6等奖怎么兑奖| www.434355.com-福彩销售员培训| www.288217.com-快开福彩是真的吗| www.437456.com-哪个彩票软件送钱| www.021620.com-下载258足球竞彩| www.mx85.com-靠赌高频彩发家的人| www.25nt.com-北京华彩大厦| www.067.cm-东莞市福彩中心电话| www.fo31.com-一分快三技巧规律| www.559922.com-彩图-| www.849331.com-全民彩票吧百度贴吧| www.141166.com-老徐说彩今日| www.652025.com-红牛快三骗局| www.789887.com-买七乐彩怎么中奖快| www.863252.com-足彩360胜负彩| www.935234.com-cp121彩票走势| www.989277.com-风凰微彩彩站下载| www.ig3.cc-彩经网大乐透杀号| www.878365.cc-内蒙古体彩下载| www.756425.com-58彩票网有托吗| www.206939.com-68彩票下载app| www.295019.com-5分彩官方网站| www.3740.com-七星彩规律图南国| www.1000.gg-爱彩票网官方网站| www.328662.com-福彩3d精选讨论| www.869229.com-七星彩网上投注| www.831539.com-全国竞彩销量排行榜| www.924970.com-彩票发财-| 国彩网www.guocai667.com| www.086035.com-cc彩票聊天室| www.107377.com-80彩app下载| www.221081.com-玩快三输了十几万| www.315579.com-七彩阳光体操视频| www.mj55.com-快三和值和尾走势图| www.36295.com-江苏快三走势爱彩乐| www.62236.com-全民福彩的安全性| www.01fa.com-双色球彩票真伪| www.874379.com-快三开奖跨度走势图| www.947113.com-谁控制高频彩开奖| 华人彩票www.040439.com| www.201075.com-河南快三投注计划| www.338412.com-福彩七乐彩预测免费| www.387018.com-大发快三中奖截屏| www.522486.com-我乐时时彩计划下载| www.580518.com-疯狂赛车彩票怎么样|