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.52xj.cc-足彩中奖率多少| www.856.red-爱投口袋彩店官网| www.076880.com-7位数彩票怎么买| www.316038.com-上海体彩销售点| www.041224.com-澳洲彩票玩法| www.142900.com-手机福彩自动选号器| www.247626.com-山东体彩网论坛| www.358469.com-手机能买体育彩票吗| www.490036.com-金口诀测彩数| www.582128.com-中彩在线怎么样| www.673602.com-古建彩绘教学| www.72ax.com-甘肃爱乐彩快3| www.681597.com-彩票算法统计app| www.49992.cc-彩神广东11选5| www.839025.com-快三下期可能出什么| www.941510.com-买彩票开口话术| www.fa29.com-一分快三破解版软件| www.13lh.com-福彩七乐彩特别号码| www.150333.com-重庆时时彩app| www.979407.com-中免好彩多少钱一包| www.90gt.com-乐彩网摘c-| www.566071.com-pp彩票出问题了吗| www.654093.com-今天江西快三走势图| www.cp4799.cc-uu快三-| www.388666.cc-大发快三全能必中法| www.631728.com-海南七星彩开奖查询| www.716889.com-初学者彩铅画画教程| www.800519.com-财经郎眼彩票| www.898217.com-百彩网手机免费资料| www.965006.com-体彩排列5中奖| 500彩票www.401275.com| www.x69.win-彩票棋牌网站| www.167208.com-贵州快三基本走势图| www.691776.com-足球14场彩票| www.828913.com-彩票站打错号| www.961136.com-福彩3d山东图| www.hy49.com-体彩福彩综合走势图| www.280908.com-重庆实时彩骗局| www.026523.com-高频彩票概率学| www.696562.com-新浪爱彩首页| www.791052.com-时时彩机器哪里有| www.877576.com-彩票开奖结果排列3| www.954098.com-黑龙江体彩网中心| 凤凰彩票www.88266c.com| www.112376.com-彩票注册送19元| www.88068.cc-彩票黑平台都有哪些| www.230718.com-精彩计划728彩票| www.917.me-福彩全国积分| www.06312.com-超级大乐透大彩网| www.gs1.cc-湖北彩票快3开奖| www.810731.com-北京市福彩中心| www.921633.com-91彩神客服-| www.xf35.com-七彩网7c77下载| www.71mp.com-众购彩票网免费注册| www.569761.com-体育彩票怎么奖| www.662693.com-今日哪个彩票开奖| www.737883.com-天天空彩票| www.814910.com-河北省体育彩票中心| www.901048.com-福彩排列五玩法说明| www.978578.com-福建体彩票31选7| www.fm93.com-内蒙古快3彩乐乐| www.r44.cc-500彩票提现流水| www.0073.cm-哪个彩票最好中奖| www.cai7311.com今日河北快三| www.35nk.com-香港开码结果开奖彩| www.40288.cc-2020网络彩票| www.08400.com-福彩刮刮乐宣传语| www.778401.com-揭密时时彩合买大厅| www.868148.com-七星彩万位杀号定胆| www.972882.com-完全比分彩客网| www.cp413.com-江苏快三网上平台| www.181231.com-好彩票安卓版下载| www.344990.com-彩票棋牌app下载| www.321605.com-安卓彩票预测系统| www.852090.com-玩彩老手双色球专栏| www.964864.com-uu真人快三输八万| www.8275.net-南昌体彩中心在哪里| www.079072.com-体育彩票怎么玩法| www.179386.com-河北快三下载安装| www.303252.com-七彩投资是真的吗| www.554007.com-晨兴彩票骗你| www.646964.com-足彩12转9算法| www.947907.com-微信哪里可以买彩票| www.cp3357.com-1分快3是什么彩票| www.t11.org-彩尊手机客户端| www.113501.com-四川快三查询结果| www.233885.com-福彩3d字继-| www.332912.com-福彩排列3预测| www.646781.com-极速时时采彩计划| www.18773.cc-乐彩彩票app入口| www.93029.com-七星彩开奖最新结果| www.8859.bid-福彩3d有没有漏洞| www.504689.com-什么叫彩排-| www.577738.com-七星彩开吗-| www.651645.com-优信彩票投注| www.239055.com-江苏快三赌博| www.0296.com-彩票店前景-| www.2524.top-安徽彩票大奖去哪领| www.879917.com-极速彩3-| www.953882.com-c59彩票下载安装| 辉煌彩票www.2875s.com| www.209478.com-福彩青海快三开奖号| www.037270.com-福利彩票3d开奖号| www.149101.com-优信彩票邀请码最新| www.228238.com-新疆福彩喜乐彩开奖| www.805279.com-七乐彩奖级对照表| www.885500.com-金利彩票可靠吗| www.969590.com-福彩3d与排列三书| www.cai3555.com北京快三结果查询| www.419.tv-3d彩票论坛大全| www.50721.com-福利彩票的走势图| www.bw14.com-快三百分百计划| www.336818.com-3d彩票有几种玩法| www.502319.com-金手指彩狗捕鱼客服| www.590161.com-关于七星彩的软件| www.967473.com-快乐双彩历史走势图| www.uz6.com-马来三分彩公平吗| www.816115.com-香港持彩吧-| www.899496.com-彩81苹果版-| www.980044.com-急聘彩票打票员一名| www.50ar.com-香港竞彩高手谈心得| www.338024.com-皇马的博彩公司| www.461877.com-七星彩当前奖池余额| www.618269.com-湖南体彩网技巧| www.829565.com-智能彩票摇号器安卓| www.113600.com-下载也买彩-| www.621755.com-春秋彩票黑钱| www.200304.com-体彩排列3开奖结果| www.862181.com-幸运彩体彩软件| www.282844.com-7星彩大奖-| www.7gf.com-彩票网络查询| www.80wk.com-tc赛车彩票-| www.689885.com-盛大娱乐彩票网址| www.830896.com-浦东彩票点-| www.927247.com-山东体彩下载| www.977633.com-宝马彩票手机版下载| www.cp234.com-全天一分快三计划| www.qo71.com-蛋蛋308彩票| www.7rm.cc-彩票六等奖怎么兑奖| www.67mm.com-万家彩票手机登陆| www.48194.com-彩票l之家-| www.91997.com-金彩网天空彩喜中彩| www.7768.biz-青岛彩票兑奖中心| www.63ul.com-彩票网租-| www.2414.xyz-福彩通图标-| www.201254.com-十分快三是骗人的么| www.391710.com-福建体彩客户端下载| www.832032.com-第一彩票网安全吗| www.729234.com-玩彩票官网-| www.444412.com-台湾福彩星图库| www.560541.com-注册送彩金软件| www.639666.cc-乌鲁木齐竞彩店| www.776377.com-时时彩四星教程| www.868167.com-老时彩360-| www.947452.com-买3d彩票手机软件| 金彩www.981jc.com| www.219376.com-福建省体彩网| www.332492.com-大奖彩票黑平台举报| www.395315.com-梅州彩民中奖| www.500825.com-摩纳哥三分彩可靠吗| www.572687.com-江苏福彩快三彩乐乐| www.645273.com-青岛西彩票一等奖| www.707508.com-南充福利彩票| www.781413.com-爱彩彩票平台|