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.024130.com-福彩前面中3个| www.113813.com-精准北京快三计划群| www.618452.com-大乐透福彩还是体彩| www.21523.cc-福彩短信投注收费吗| www.210428.com-快三平台搭建| www.71322.cc-江苏快三遗落号| www.9us.com-彩乐汇时时彩平台| www.344757.com-彩8娱乐有猫腻吗| www.090773.com-2元买彩票-| www.874251.com-秒秒彩立即开奖| www.139349.com-玩时时彩死了多少人| www.261626.com-黑客玩时时彩稳赚| www.671164.com-三彩新品-| www.810892.com-快三数字图-| www.975092.com-今曰福彩开奖结果| www.mq89.com-旺彩3d下载-| www.52396.cc-玩彩票怎样发展下线| www.008199.com-酷彩彩票骗局揭秘| www.085969.com-彩票反水网站| www.156996.com-五四北福彩-| 幸运众彩www.108129.com| www.js42.cc-玩大小单双彩票| www.33439.com-海南快三结果查询| www.m23.xyz-河北快三套选| www.973.in-七星彩去哪里兑奖| www.23854.com-快三单跳双跳| www.337708.com-电脑开机彩屏| www.295736.com-中国人快三网| www.555327.com-福祥彩票-| www.735143.com-七乐彩中奖率多少| www.882780.com-河南彩礼多少钱| www.961767.com-彩票系统福利案件| www.cai4122.com快三是一款什么游戏| www.919.cc-咋申请彩票投注站| www.39293.cc-全中彩票老版本| www.16yp.com-如何开好一家彩票店| www.50944.com-彩75彩票输了| www.287045.com-彩票数据接口| www.569536.com-天下好彩免费大全| www.812272.com-三天计划福彩3d| www.941376.com-福彩7乐彩开奖号码| www.14mm.cc-彩票群英会怎么玩| www.z28.net-彩票大i赢家| www.661973.com-竞彩爆冷原因| www.109785.com-北京单场新浪爱彩| www.y11.cc-排列三乐彩字谜图| www.24525.com-昙花彩铅画-| www.592656.cc-七星彩局王奖表下载| www.739480.com-时时彩合买大厅骗局| www.822430.com-福彩双色球胆拖计算| www.938566.com-时时彩代理怎么判刑| www.996800.cc-北京彩票中心地址| www.gt14.com-7彩平台下载| www.11372.cc-竞彩网天天竞猜| www.73al.com-800vip彩票-| www.312231.com-分分彩怎么看长龙| www.640087.com-奥克体育彩票体| www.723285.com-常州福彩网-| www.817996.com-足彩网售-| www.906513.com-吉林省黑彩举报电话| www.ao03.com-网易彩票购彩平台| www.097187.com-福彩小鱼图反正面| www.752970.com-哪个彩票app好用| www.633099.com-竞彩篮球大小分结果| www.789253.com-足彩妖刀博客| www.936045.com-聚宝盆彩票网站| www.376821.com-澳门988彩票| www.040958.com-中国福彩购彩大厅| www.345129.com-如何开网售体育彩票| www.029845.com-彩虹屁是花式夸人| www.380808.com-找回我的彩票| 财神网Ⅱwww.cp7836.com| www.dm73.com-快三一个号码怎么组| www.129286.com-哪个app能买彩票| www.187985.com-赢彩彩票网站| www.875114.com-酷彩吧app安卓| www.985343.com-nba竞彩网首页| www.mx65.com-旺彩社区下载| www.554294.com-山东福彩开奖查询| www.652186.com-中国体彩网开奖号| www.11632.cc-打彩平台什么意思| www.08fq.com-夕阳西下彩铅画| www.3775.cm-体育体彩开奖查询| www.536735.com-双色500彩票| www.051384.com-重庆时时双彩网| www.177320.com-福彩内蒙快3走势图| www.mv57.com-能买彩票的手机软件| www.9wh.cc-彩票几点就不能买了| www.67nt.com-彩票中一个亿得多少| www.997908.com-乐彩网三d复隔中| www.967205.com-聊呗彩票群-| www.1698.vip-彩票分析计划师| www.t33.top-七乐彩试机号开| www.g32.club-苹果彩票-| www.019922.com-699彩票安卓| www.197654.com-中彩网旧版走势图| www.38359.cc-北京时彩时彩开奖| www.810922.com-九州彩票网靠谱吗| www.4256.xyz-优乐彩网址-| www.905920.com-福建福彩中心官网| www.973826.com-易彩网彩票怎么开挂| 旺旺彩票www.764499.com| www.51175.com-彩之源怎么下载| www.35106.com-有玩彩票的群么| www.24735.com-彩铅花卉简单| www.089926.com-7乐彩怎么玩| www.495112.com-足彩通红球球app| www.923951.com-cp55彩票-| www.982649.com-三的天天彩-| www.3682.in-万彩吧高手彩票计划| www.940.live-概率论与彩票| www.kj3.com-安徽快三豹子遗漏| www.015093.com-彩票代理-| www.178792.com-福彩3d预测总汇| www.947713.com-多彩贵州网评论| 世彩堂www.5854w.cc| www.ot61.com-彩票软件合法吗| www.176100.com-快三计划软件官网| www.32uy.com-盈众彩票app| www.89pj.com-百姓彩坛网-| www.98yj.com-彩票买合平台| www.698392.com-网上买彩票倍投好吗| 大赢家彩票平台www.978137.com| www.183458.com-福彩双色球开奖公告| www.1105.net-天天爱彩票可靠么| www.7281.vip-pc彩蛋28-| www.41487.com-彩票直通车可信| www.887181.com-网上彩票是真的吗| www.ul43.com-福彩3d阴阳走势| www.4383.org-中华彩票网安卓客户| www.wj76.com-全能体彩官网| www.285.website七星彩三字定位全倒| www.200988.cc-广西福彩快三走势| www.290718.com-3d走势图彩宝网的| www.528615.com-双色球期彩票指南报| www.599763.com-福利彩票快乐彩直播| www.665281.com-彩壹万平台下载| www.745801.com-特区彩票网海南论坛| www.800377.com-买彩微信群-| www.919613.com-靠谱的彩票平台程序| www.9085.cm-七星彩头尾表图| www.3304.org-159彩票客户端| www.24771.com-彩铅鸟-| www.71392.com-美国的彩票业及发展| www.023077.com-南方彩票网预测分析| www.774617.com-篮彩竞彩怎么玩| www.086073.com-分分彩怎么刷赚钱| www.97782.cc-彩光嫩肤-| www.077855.com-七星彩奖图表| www.142220.com-中彩网免费资料大全| www.318014.com-稳定的彩票销售软件| www.77944.cc-彩票走势规律| www.063389.com-十大私彩排行| www.153816.com-310足彩任九奖金| www.311966.cc-甘肃省体彩中心地址| www.506929.com-香港皇家时时彩宝典| www.828704.com-永丰彩票-| www.958269.com-福彩快3查询| www.tn2.com-彩票开奖结果七星彩| www.369646.com-…七乐彩-| www.503716.com-哪个彩票送彩金| www.298691.com-甘肃快三夸度走势图| www.923395.com-买彩票可靠吗| www.982713.com-67彩票登录-|