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天

知道了
9彩注册 www.969284.com-酷吧彩票-| www.52158.cc-彩票资讯双色球| www.05tj.com-儿童可水洗彩笔| www.0802.cm-刷彩员-| www.yq59.com-吉林体彩常用担托| www.1166.pw-彩票条目-| www.58782.cc-安装双色彩票| www.686862.com-足彩比赛直播| www.950198.com-乐彩客安卓版| www.cg4.cc-北京福彩快三和值| www.161386.com-广州体彩投注站| www.257235.com-快三客开奖app| www.364009.com-刚力彩芽下海了吗| www.480821.com-和彩云下载官方下载| www.563162.com-老彩民高手论坛1| www.55069.com-恒彩彩票软件下载| www.860870.com-体彩山东11选五| www.947839.com-竞彩彩客网比分直播| 网易彩票www.07163m.com| www.167776.com-快3彩票开奖号码| www.34314.com-上海体彩用户名| 东方国际www.451117.com| www.537560.com-哪些东西是彩色的| www.279629.com-手机彩票双色球| www.0437.bid-和田市体彩店| www.444377.com-快三下载app| www.593361.com-七彩国际平台| www.702361.com-好彩客官方网站下载| www.842832.com-福彩志愿者心得体会| www.951005.com-玩运彩-| 易彩集团www.25688m.com| www.098577.com-优彩网平台-| www.8902.cn-射阳竞彩店-| www.78387.cc-彩票3d的方法| www.383842.com-010彩票app-| www.163978.com-福彩3d太难了| www.984341.com-体彩彩票助手手机版| www.bh47.com-棒棒彩票怎样诈骗的| www.1nl.com-体彩店可以转让吗| www.888.black-彩铅画教程古风男妆| www.363351.com-彩虹桥事件-| www.556333.com-广东体彩顶呱刮新票| www.685898.com-买彩票软件有哪些| www.2463.cc-今天东盛彩报1| www.15247.cc-中国彩app怎么样| www.124770.com-福利快三能买单双吗| www.88244.com-彩票天天领红包| www.074356.com-旭彩可靠-| www.419123.com-易旺彩票网邀请码| www.op42.com-彩票32-| www.984500.com-微信打彩票-| www.119725.com-发彩平台-| www.55512.com-皇冠nba博彩| www.988047.com-仲彩网站-| www.we55.com-体育彩票店布置图片| www.423218.com-彩票软件推广哪家好| www.49985.com-6十1七乐彩-| www.751834.com-彩票一号平台登录| www.554433.com-经典福彩广告语| www.76072.com-彩票可以折贴| www.077119.com-体育彩票俄罗斯| www.84ud.com-体彩会开发新游戏| www.5292.biz-白银市福彩中心电话| www.082.online-上诲快三开奖结果| www.830147.com-盈彩网注册-| www.947301.com-快三口决-| 500彩票www.50080g.com| www.je65.com-五分彩是正规彩票吗| www.n97.xyz-广东快三官网| www.40kl.com-浙讧体彩20选5| www.786.hk-复式彩票中奖率高吗| www.780878.com-杏彩彩票骗局| www.ly62.com-彩之家官方正版下载| www.17aj.com-球探彩票正规吗| www.468833.com-手机迷彩-| www.365438.cc-简单彩铅风景画| www.183677.com-北京快三大小怎么看| www.128841.com-环球彩票不能提现| www.36rh.com-购彩票网-| www.215.biz-鼎丰彩票邀请码| www.062681.com-体彩屋下载地址| www.035852.com-福利彩票站开业宣传| www.703700.cc-998彩票软件| www.461911.com-3d天天彩图片| www.522285.com-易购娱乐时时彩贴吧| www.127561.com-彩虹代刷app源码| www.35jh.com-最新局王七星彩奖图| www.062431.com-瑞彩祥云αpp| www.122022.com-6188彩票骗局| www.cj58.com-福利彩大发快3下载| www.ur49.com-江苏省福彩快3开奖| www.234757.com-五百彩-| www.xv5.com-内蒙快三最大遗漏号| www.89wh.com-高频彩分析-| www.0856.date-778彩票网-| www.285884.com-1a彩票-| www.449808.com-乐米彩票可靠吗| www.sw19.com-湖北快三和值奖金| www.cp860.com-福彩快三网上投注站| www.4054.cn-青海福彩网专刊| www.491169.com-十分彩官网开奖结果| www.622106.com-凤凰彩票官网是多少| www.777677.cc-韦德网站博彩| www.778773.com-釉中彩餐具能消毒嘛| www.39585.cc-九歌彩票吞奖| www.23hl.com-彩票编辑程序| www.969159.com-天天彩票正规吗| www.286850.com-安徽快三破解| www.2007.org-自己分析彩票软件| www.528716.com-大乐透复式彩票| www.604864.com-雀彩-| www.639145.com-余姚体彩哪里申请| www.716828.com-48色彩铅色卡| www.997767.com-c58彩票安卓版| www.a55.org-淘宝彩票下载手机版| www.678941.com-白菜网彩金网| www.288268.com-彩票网址导航大全| www.69784.com-微信国彩骗局揭秘| www.395639.com-刻家奇门预测彩票| www.503706.com-体彩打错票怎样退票| www.457511.com-足球彩票软件大全| www.098485.com-国彩网站有哪些| www.604470.com-彩吧p3试机号今天| www.000314.com-多彩app官网| www.103498.com-竞彩足球胜平负分析| www.751113.com-彩票玩的是心态| www.846181.com-彩票会不会作假| www.929157.com-9万彩票是骗局揭秘| www.987977.com-福利彩票什么叫倍投| www.cp9287.com-今日中彩app| www.957346.com-7星彩开奖结果网易| 众乐彩票www.498266.com| www.498030.com-连中彩票靠谱吗| www.287342.com-台北快三走势图| www.408032.com-国家规定彩礼| www.512557.com-彩铅人物简笔画眼睛| www.937453.com-时时彩一星复式| 88彩票www.8839p.com| www.100332.com-百宝彩怎么申请账号| www.02931.com-35彩票计划-| www.328785.com-河北快三形态走势| www.153319.com-快三走势图下载| www.163245.com-网上拉人玩彩票套路| www.7774.loan-时时彩7码公式| www.83111.cc-绵阳福彩100万| www.778526.com-彩拾彩票软件| www.883567.com-奔驰彩票是合法的吗| www.967764.com-彩票诈骗套路案例| www.uw57.com-彩票走势图表| www.30lq.com-色彩头像图片| www.336.hk-趣彩彩票安卓版下| www.83289.com-甘肃快三下载图官网| www.7764.me-多多中彩票是真的吗| www.52869.cc-好彩网可以赚钱吗| www.683185.com-致富彩是不是骗局| www.td13.com-竞彩足球玩法| www.618507.com-精彩助手-| www.58712.cc-彩票3d彩报-| www.952395.com-仲博彩票官网下载| www.991468.com-中彩啦能买彩票吗| www.nd6.com-一分快三走势图表| www.398078.com-七星彩刮头尾| www.522120.com-老时时彩龙虎和计划| www.886385.com-赛车时时彩计划软件|