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.728456.com-揭秘时时彩骗局| www.429699.com-创意水彩画动物图片| www.994138.cc-上海快三有什么窍门| www.bi79.com-彩票站app-| www.wx30.com-江苏快三开下载安装| www.14zs.com-qq彩票下载app| www.964943.com-体彩官网电脑版首页| www.cai5025.com福彩快三助手| www.tv46.com-彩票下载平台| www.009780.com-互联网销售彩票犯法| www.084456.com-江苏快三人工计划网| www.146655.com-竞彩足球360混合| www.013841.com-帮忙看彩票是否中奖| www.111582.com-883彩票-| www.202043.com-福彩3d过滤器软件| www.825038.com-全民汇彩票网页版| www.901227.com-体彩排列三牛彩总汇| www.971558.com-彩票最新开奖结| www.pu28.com-体彩排列三出奖号| www.11xv.com-彩票每日签到送现金| www.96ok.com-万达国际彩票网站| www.272537.com-ig彩票官方网站| www.59950.com-百乐彩网站-| www.051997.com-彩神ⅱ是正规的吗| www.958747.com-网络彩票赌博报警| www.bx9.com-彩1app-| www.631292.com-足球彩票怎么算注数| www.90047.com-彩票倍投计算器下载| www.255681.com-快三彩票平台送彩金| www.oe96.com-手机买彩票安全可靠| www.020989.com-大马彩多多万能成绩| www.222776.com-五分快三免费计划网| www.5591.cn-爱七乐彩开奖结果| www.85500.cc-赢彩网排列三试机号| www.899383.com-博发彩票是否违法| 大赢家彩票平台www.925771.com| www.98gp.com-天天彩票怎么注册| www.4307.vip-双彩论坎-| www.220375.com-体彩三天计划独胆| www.103979.com-福利彩票网上购买| www.504534.com-黄渤彩票号码| www.582234.com-彩客网彩票完整| www.664080.com-020彩票app-| www.750563.com-中彩在线多人玩么| www.848634.com-时时彩非凡在线计划| www.931907.com-体彩门头-| 大赢家彩票网www.54400h.com| www.te78.com-分分时时彩规律口诀| www.26356.cc-双色球彩票开蒋| www.085010.com-时时彩赢彩王app| www.985828.com-c61彩票app-| www.527667.com-百乐彩娱乐官网下载| www.701867.com-时时彩二星直选技巧| www.788153.com-特彩吧高手网齐中网| www.877854.com-乐彩客彩票下载| www.951674.com-足彩6串1全包技巧| www.996884.com-机选一注七星彩号码| www.tr3.com-江西快三遗漏数据| www.oj97.com-湖南福彩总部电话| www.v64.com-中国体彩赛事推存| www.45sn.com-皇冠彩票提款不给提| www.5031.cc-吉祥彩票是不是黑网| www.088567.com-快三推荐湖北| www.188881.com-内蒙古快三50| www.128726.com-南宁快三秒奶茶原料| www.gq54.com-彩钢围挡厂家| www.179068.com-微信群里玩快三幕后| www.300068.cc-快三数据表-| www.403633.cc-订婚礼金和结婚彩礼| www.76879.com-体彩胜负平规则| www.2ln.cc-买彩票输了全部的钱| www.635922.com-河南福彩七乐彩| www.ie24.com-七星彩内部骗局手段| www.x98.net-彩运快三专区| www.64ok.com-大吉大利刮刮乐彩票| www.760332.com-西蔵快三开奖| www.51gq.cc-足彩收米动态图片| www.0208.cc-彩票必赢方法| www.396217.com-金钱豹彩报-| www.721164.com-管家婆彩票论坛下载| www.807345.com-那个网站可以买彩票| www.900071.cc-福彩快3魔图| www.961114.com-内蒙古体彩网点| 好彩www.60123t.com| www.sp71.com-七乐彩专家预测号码| www.62sl.com-义乌市体彩中心地址| www.5619.cc-买彩票的导师2| www.16714.com-福利彩票快三手机版| www.487543.com-福彩3d今日说彩| www.656071.com-英国星彩-| www.741125.com-福彩刮刮乐最新品种| www.820098.com-七乐彩杀号公式大全| www.885463.com-2118彩票软件| www.950065.com-人民网互联网彩票| www.991650.com-血缘园足彩比分直播| www.np0.cc-吉快3彩经网走势图| www.ni01.com-竞彩单场分析推荐| www.v12.biz-中国足彩网彩票| www.101137.com-西安彩运宝可靠吗| www.2160.live-大发彩票提现3天| www.7554.vip-做个彩票网站多少钱| www.598747.com-长春彩钢房厂家| www.35126.cc-彩票定理-| www.79295.com-体彩线上培训| www.023501.com-福彩3d胆码速查表| www.4239.vip-七彩汇下载二维码| www.37099.cc-湖南省体育彩票| www.82888.com-彩票双色球领奖地址| www.033097.com-网易彩票怎么买不了| www.109336.com-好彩客挂机投注| www.177999.com-北京福彩中心官网| www.787326.com-体彩开奖查讯| www.920327.com-河北省体彩开奖查询| 500彩票www.377501.com| www.xf06.com-河北快三开结果| www.5855.com-4oo5oo好彩堂| www.35066.cc-时时彩的数字规律| www.81049.com-体彩中彩网-| www.053797.com-澳客竞彩足球直播| www.405139.com-福建体彩高频走势图| www.633606.com-天下彩免费手机资料| www.032801.com-赢彩彩票注册邀请码| www.96872.com-海南私彩合法吗| www.0793.org-彩票之家注册邀请码| www.344818.com-运彩朋友圈-| www.258951.com-虚拟彩票快三投注| www.373110.com-吉林省快三调整| www.444653.com-金立方彩票插件| www.539113.com-重庆时时彩各种玩法| www.064604.com-最稳的彩票平台| www.520311.com-体彩红叶杀码今天的| www.595585.com-晒彩票被冒领| www.657063.com-久久彩票安卓版| www.866046.com-七星彩私彩平台网站| www.939513.com-彩吧彩票注册| 六福彩票www.66ffx.com| www.7433.cm-苏州昆山体彩店转让| www.44400.cc-手机淘宝买彩票| www.564999.com-河南快三和值| www.631545.com-体育七星彩走势图| www.694022.com-福彩极速快三计划| www.761883.com-彩之家注册账号| www.815089.com-福彩拍列七走试图| www.871764.com-快速49彩下载| www.922196.com-人人彩票推荐码| www.968946.com-网络彩票诈骗赌博| 500彩票www.501349.com| www.gp04.com-四川彩礼价目表| www.wq67.com-安徽福彩快3查询| www.05pq.com-新年快乐幼儿彩铅画| www.605220.com-众彩彩票论坛大全| www.505411.com-福利彩世界的邀请码| www.611240.com-江苏快三出号分析| www.878325.com-福彩3d九宫五行图| 顶级娱乐www.012288.com| www.01oc.com-福利彩票选四开奖号| www.3819.com-竞彩足球如何买稳赚| www.258921.com-浙江体彩爱乐彩| www.374.cn-今日大乐透彩民晒票| www.4358.org-彩票兑奖方法| 大赢家彩票网www.83033v.com| www.bp79.com-手机彩票过滤工具| www.987946.com-新快三购买方案| www.ij15.com-福彩3d和值查询表|