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天

知道了
百盈PK10 www.567638.com-66彩票网-| www.041750.com-英皇贵族快三| www.199138.com-彩票平台提现失败| www.351285.com-体彩能买足球吗| www.954723.com-彩票足球世界杯| www.387726.com-凤城十路有彩票店| www.04638.com-微信有人带我买彩票| www.977898.com-彩色纸箱印刷| www.224502.com-发彩网真能赚钱吗| www.585695.com-妛客网彩票-| www.44470.com-三个数的彩票是什么| www.223900.com-e球彩走势-| www.812500.com-3d杀一跨彩宝贝| www.956839.com-七彩神仙论坛| www.et82.com-北京5分彩开奖记录| www.2766.in-爱乐彩走势图| www.150908.com-乐彩网点播-| www.957788.com-帝王彩票是真的吗| www.674508.com-亚洲彩票官方网站| www.77626.com-好彩堂资料中心| www.117.gg-今晚3d彩报图片| www.363592.com-鼎巨国际彩票靠谱吗| www.870482.com-彩39彩票app| www.ik15.com-500彩下载网址| www.306382.com-刷彩app-| www.72ce.com-cba篮彩竞猜推荐| www.7697.xyz-海南体彩电话购彩| www.705491.com-彩票300秒app| www.680061.com-ok彩票最新版下载| www.770976.com-时时彩4码技巧| www.856708.com-5分钟快三结果| www.928787.com-中福时时彩怎么提现| www.984113.com-上海福彩网4d| www.kf6.cc-体彩11选五-| www.905017.com-江苏快三开奖结果漏| www.922395.com-招聘竞彩分析师| www.608502.com-江苏快三开奖电视图| www.724014.com-湖北快三开奖直播| www.837067.com-江苏体彩足球竞彩| www.929233.com-刺客彩研网彩票论坛| www.53xb.com-彩虹堂官方下载| 中国福利彩票www.34788c.com| www.16891.com-横彩网网站-| www.767475.com-牛蛙彩资料-| www.855539.com-初夏福彩3d-| www.950340.com-乐彩网怎么打不开| www.jb02.com-彩票app系统| www.6cx.com-天福合买购彩平台| www.84xn.com-送彩金得打鱼平台| www.000780.com-分分时时彩票| www.535022.com-2元彩票网com| www.633889.com-东方亮彩被收购一事| www.441698.com-体彩销售提高技巧| www.555599.com-快三中顺子-| 万历彩票www.77114q.com| www.615243.com-开发彩票app| www.812963.com-杏娱彩票-| www.911828.cc-大发快三如何倍投| www.984145.com-彩票三期倍投计划表| www.fy79.com-英国时时彩开奖网络| www.235036.com-中国彩票下载手机版| www.2045.tv-建彩票平台-| www.69257.cc-500彩票幸运三| www.018682.com-南京丰彩涂料电话| www.191090.com-快三大小走势怎么看| www.198.cm-唯美古风女子彩铅画| www.7517.biz-体彩怎么申请竞猜| www.rm19.com-3分钟时时彩| www.9097.loan-中国更懂便民彩吧| www.28514.com-快乐扑克3彩乐乐| www.508426.com-东莞福彩兑换中心| www.617982.com-小林子好运气彩票店| www.704905.com-宝马彩票注册送38| www.787449.com-聚彩论坛网址是什么| www.874285.com-七星彩解梦册查码王| www.956556.com-彩票概率论-| www.ap9.com-3d走势图百度乐彩| www.uv07.com-重庆快三最新骗局| www.383469.com-6h彩友网-| www.482638.com-天下彩票网址多少| www.552283.com-白彩论坛-| www.608524.com-彩葵网手机app| www.801855.com-体彩代销证编号查询| www.872421.com-中大奖彩票网站| www.41350.com-竞彩跟单哪个平台好| www.13442.com-竞彩8串9容错几场| www.679.cm-福彩三d鑫鑫预测| www.105623.com-好彩三开奖奖金查询| www.198664.com-彩神ⅴll-| www.84519.com-福彩刮刮乐领奖流程| www.097700.com-快三吉林长春| www.170920.com-快三走势图今天吉林| www.238094.com-皇元彩票是真是假| www.314445.com-彩票攻略网-| www.371914.com-中国彩是什么| www.453166.com-领先彩票平台| www.553229.com-足彩竞彩漏洞| www.616123.com-体彩扑克三玩法| www.683675.com-彩61官方-| www.782829.com-昆明体彩中心兑奖处| www.862309.cc-3g乐彩网-| www.945356.com-乐8网彩票app| 乐彩赢www.0014x.com| www.590115.com-七星彩定胆杀号| www.680998.com-一分快3vip彩票| www.789062.com-浙江福利彩票走势图| www.874147.com-全天三分彩在线计划| www.960706.com-平台注册送8元彩金| www.40268.com-淘彩票官网下载| www.627786.com-双色球彩票讨论区| www.760312.com-彩客网310胜负彩| www.8959.top-更多精彩点此进入| www.299629.com-彩票巴士多久了| www.387044.com-名彩手机膜怎么样| www.521060.com-网络彩票赌博有赢吗| www.023545.com-福彩的开机号| www.184521.com-彩票一分快三的技巧| www.ou08.com-靠谱的彩票预测软件| www.86ik.com-竞猜彩篮球推荐| www.4263.com-双彩迷图-| www.31065.com-彩票中奖哪里领奖| www.80874.com-福彩排列7怎么买| www.983706.com-快三到几点-| www.371840.com-亚洲杯彩票怎么玩| www.53645.com-腾龙时时彩软件安卓| www.732162.com-彩礼超2万视为贩卖| www.888249.com-137彩票平台| www.99uk.com-福利彩票赛马怎么玩| www.nd44.com-幸运快三5分钟开奖| www.kp67.com-江苏省福彩兑奖地址| www.42796.com-怎样下载彩经网| www.053163.com-时时彩代理抽流水| www.188221.com-体彩481近30期| www.310129.com-漯河市体彩中心电话| www.450391.com-七乐彩胆拖价目表| www.3903.cn-唯球看彩-| www.cp662.cc-福建省福彩-| www.978486.com-天天好彩生肖号码| www.526303.com-h辉煌彩票下载安装| www.082.host-云彩店app二维码| www.508690.com-中国体彩排三开奖号| www.7273.biz-在中国都有那些彩票| www.009835.com-熊猫彩票8-| www.513690.com-彩票多久一期| www.238086.com-快三杀一号码经验| www.445527.com-彩票历史统计器| www.610128.com-彩票都有几选几| www.979986.com-福彩3d投注网站| www.31ta.com-彩虹约定儿歌歌词| www.91471.com-焕彩美容培训班| www.113822.com-山东手机体彩| www.081039.com-uu彩票倒闭了| www.698725.com-华夏彩票提现不了| www.795900.com-至尊彩霸官网| www.5284.xyz-派彩网违法吗| www.6596.xyz-彩坛达人福彩杀五码| www.171822.com-一分快三-| www.451888.cc-澳门彩票官方投注网| www.580580.com-彩票吉林省中奖情况| www.9305.vip-七星彩二等奖中奖率| www.79360.com-彩友258-| www.302548.com-彩票中奖号码生成器| www.381422.com-7乐彩开奖出球顺序| www.383255.com-彩票条码在哪|