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.74206.com-极速时时彩结果| www.126090.com-湖北有哪些彩票网| www.088028.com-彩票699-| www.231125.com-正规彩票投注app| www.887809.com-彩票号码输入查询| www.29bl.com-福建体彩在线投注| www.99ph.com-江西福彩哪个台直播| www.001794.com-七星彩复式计算| www.041193.com-时时彩开奖助手官方| www.003479.com-怎么买电子彩票| www.195583.com-百宝彩票快3| 9928彩票www.9928g.com| www.89303.com-查询彩票助手软件| www.5483.cm-长春纹彩刺青地址| www.73668.com-新生彩票测速| www.11317.com-凤凰竞彩推荐| www.44mg.com-足彩3串4怎么买| www.26135.cc-彩虹羽泉酷我| www.6964.me-cp77趣彩com| www.210998.com-合肥福彩快三| www.178667.com-e球彩-| www.550608.com-彩民彩票和中奖彩票| www.ju26.com-彩铅颜色搭配口诀| www.03oj.com-七彩专栏-| www.293.red-哪里可以买七星彩| www.620721.com-3d今日彩圣字谜| www.712224.com-时时彩后二杀码思路| www.44rt.com-扬州彩虹冰淇淋机| www.624.date-网赌时时彩输| www.929449.com-福彩88-| www.58718.com-竞彩足球比分预测网| www.000106.com-天津新宇彩板销售部| www.348896.com-彩票高手网齐中网| www.380221.com-彩红代刷网快手| www.029689.com-内蒙古福彩软件下载| www.wu42.com-彩票开奖七星彩查询| www.004568.com-福彩开将结果| www.360067.com-七星彩摇号器| www.66581.cc-彩票中奖流程| www.07062.com-香港澳门彩票平台| www.f40.com-海南彩票怎么买| www.57ms.com-cy888彩网-| www.896.cc-新浪爱彩篮彩推荐| www.539028.com-5分钟新3d彩票| www.635666.com-皇冠彩票网提不出款| www.732699.com-体育彩票开奖7位数| www.808332.com-侯彩彩票app软件| www.876400.com-体彩5d出什么号| www.948467.com-天天彩票公益资料| 财神网www.29277v.com| www.91828.cc-双色彩票-| www.091111.cc-重庆时时彩登录| www.161049.com-湖北快三杀号计划| www.251162.com-福中彩票下载| www.p69.net-福彩3dapp软件| www.74co.com-黑彩挣钱-| www.581102.com-足彩任九场投注秘诀| www.062934.com-福彩3d红人胆码| www.029883.com-福彩三地开奖走势图| www.692988.com-口袋彩票不能用了| www.782237.com-中福彩app-| www.876615.com-万彩吧彩票排三预测| www.948662.com-微信群教玩快三| 中国福利彩票www.08588z.com| www.879048.com-彩种分为多少种| www.eu07.com-黑龙江福彩-| www.yz57.com-吉林快三型态走式图| www.9083.vip-禁止网上售彩| www.607438.com-福彩3d三强会员版| www.805699.com-九盛彩票是正规的吗| www.063501.com-靠得住的私彩平台| www.205056.com-内蒙快三和值走势图| www.289010.com-免费下载全民彩票| www.ou19.com-3d福彩破解-| www.813700.com-福彩代理收入| www.815.biz-互助路几家体彩店| 99福彩www.379969.com| www.892645.com-瑞祥彩云-| www.962817.com-银河彩票是正版网吗| www.cp4.tv-贵州福彩快三开奖号| www.036878.com-在线做号工具时时彩| www.58374.cc-人人中彩票没了| www.731142.com-竞彩足球即时开奖| www.588929.com-玩家时代彩票平台| www.666823.com-国乐彩手机版| www.740090.com-澳彩网客户端| www.809231.com-必慱彩票跑那去了| www.886800.com-钻石彩票-| www.948840.com-体育彩票有刮刮乐吗| www.998058.com-17彩票2018-| www.bt96.cc-大发快三软件| www.sh50.cc-亚投彩票靠谱吗| www.520452.com-1012期彩票-| www.585396.com-首充一元送18彩金| www.649365.com-京彩计划-| www.710578.com-彩票套菜什么意思| www.775551.cc-排列五众彩-| www.836407.com-大发500彩票平台| www.895771.com-甘肃快三一码遗漏| www.954782.com-今日彩票吉数查询| www.998405.com-燕郊彩票站-| www.ta2.cc-快三走势分析预测| www.900368.com-e乐彩官网下载| www.984041.com-彩99提现一万| www.cp3119.com-单机游戏新快三| www.x25.shop-体彩排五预测总汇| www.789404.com-竞彩篮球软件哪个好| www.6093.cn-嬴彩彩票与你同行| www.7635.xyz-彩票店柜台效果图| www.25781.cc-幸运飞艇是官方彩| www.44355.cc-彩票竞猜app| www.241515.com-彩吧彩票app| www.430868.com-齐鲁风彩双色球预测| www.576595.com-中国福利彩票讨论群| www.736291.com-七色彩虹图片| www.841013.com-噢客彩票com| www.953343.com-竞彩首页网计算| www.bd58.com-快三安徽开奖走势图| www.543233.com-福彩3d高手在民间| www.934224.com-太子彩票app| www.sh97.com-彩app下载送彩金| www.535.club-喝彩中华-| www.502807.com-福彩3d必出一码| www.509744.com-旧版手机彩客网| www.699619.com-微信快三托-| www.827683.com-分分时时彩是谁开的| www.901167.com-皇都彩票是骗人的| www.982538.com-天空彩票软件| www.of08.com-福利彩票网站| www.871644.com-足彩过滤-| www.005156.com-体彩排3试机号查询| www.121572.com-福彩陕西福利彩票网| www.011002.com-昨天的彩票是什么| www.76970.com-98c手机彩票| www.150055.com-中国甘肃甘肃快三| www.4757.vip-游戏厅彩票多取技巧| www.621109.com-众赢彩票正规吗| www.684858.com-彩票代投兼职靠谱吗| www.775130.com-k彩福地1970| www.843298.com-体育彩票基金会| www.893097.com-七星彩开奖直播新浪| www.81951.com-中发彩票怎么回事| www.66760.com-福彩怎么兑奖| www.354933.com-黑龙江体彩网官网| www.532476.com-数学彩票计算软件| www.857023.com-快三倍投方案图片| www.827355.com-华阳彩票下载| www.cp6221.com-竞彩500-| www.13eq.com-河北快三有几个号码| www.348257.com-彩虹瓶特别颜色搭配| www.554968.com-彩票号码7位数| www.727038.com-乐彩网彩票走势图| www.909738.com-玩彩人杀码-| 百姓彩票www.bxcp3.com| www.yl20.cc-网上彩票投注哪个好| www.67ir.com-阳泉体彩管理中心| www.7899.me-淘彩娱乐是骗局吗| www.426159.com-足彩胜负彩新浪预测| www.510800.com-彩虹谷门票-| www.602563.com-游彩票-| www.648.me-易彩乐快三平台| www.680897.com-福彩开奖链接| www.822985.com-彩票双色球骗局揭秘| www.949603.com-百汇彩票靠谱吗|