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.008792.com-腾讯五分彩开奖地址| www.135965.com-买彩票网站有哪些| www.328432.com-福彩购买平台| www.569871.com-福彩快三输了几万| www.067359.com-时时彩哪个好| www.875695.com-今期彩图片-| www.96129.cc-体彩甘肃11选| www.788022.com-310足彩代表什么| www.152727.com-cc彩票网-| www.973823.com-福彩双色球蓝球定胆| www.158731.com-体彩小珍独胆专家准| www.522099.com-体彩授权自动售彩机| www.751490.com-胜负彩足球彩票| www.874369.com-安快三开一定牛| www.995836.com-下载743好彩软件| www.eq34.com-炫乐彩票苹果版| www.004107.com-体育彩票大乐查询| www.245008.com-易彩彩票是正规的吗| www.583160.com-看彩票下什么软件好| www.023703.com-百胜彩票网是黑网吗| www.254563.com-好彩60123-| www.384699.com-哈尔滨彩票大王老马| www.642126.com-买彩票有假吗| www.3908.top-海南七星彩开奖软件| www.89334.com-汪汪时时彩新版本| www.586021.com-易博国际时时彩| www.731237.com-分分时彩最牛技巧| www.888782.com-网易彩票旧版| www.cp518.cc-快三破解器是真是假| www.5mc.cc-重庆时时彩倍投技巧| www.qh35.com-好彩蓝莓双爆怎么样| www.94qi.com-福彩领奖时限多久| www.873934.com-甘隶快三开奖| www.rv34.com-博牛彩票破解| www.149633.com-时时彩开奖预测助手| www.821928.com-湖北精彩十分钟玩法| www.922661.com-人人买彩票客服电话| 8号彩票www.60108n.com| www.369998.com-国家彩票做假视频| www.206403.com-唐龙说彩大全| www.360815.com-茗彩app-| www.482193.com-体彩排列五怎么兑奖| www.uw11.com-正规的合买彩票网站| www.40151.com-优选彩app下载| www.766828.com-好运彩彩票骗局| www.867824.com-97彩票兼职可靠吗| www.935088.com-福彩三地新彩吧| www.997755.com-乐彩网排列五走势图| www.yy3.com-大发快三怎么看大小| www.ov00.com-福彩快三实时走势图| www.y13.net-奇妙时时彩趋势软件| www.467475.com-分分彩扫微信二维码| www.302823.com-大富彩票app| www.4620.cc-目前都在哪里买彩票| www.374178.com-北仑体育彩票大奖| www.974948.com-体彩大乐透奖金纳税| www.251125.com-中福彩票邀请码| www.778113.com-彩票app手机| www.861597.com-中原风彩-| www.945899.com-河南信阳彩礼多少| 688彩票www.030.la| www.761605.com-河南体育彩票玩法| www.829110.com-彩票九app下载| www.898921.com-下载app送彩金| www.964904.com-三水中国福利彩票站| 鑫亿彩www.039079.com| www.299836.com-天天中彩票能不能用| www.7358.vip-9811彩票-| www.yv84.com-云南福彩中心白云路| www.717516.com-彩色铅笔画技巧| www.613399.com-自助福彩机-| www.969240.com-众彩网有诈-| www.xf4.cc-彩票快3选号技巧| www.tp50.com-计算彩票的软件下载| www.10qp.com-神龙彩票骗局| www.93vr.com-福彩3d久久彩吧| www.485540.com-kpl五大精彩瞬间| www.576835.com-743好彩软件| www.658353.com-我中啦彩票网关停| www.951584.com-手机红彩会-| www.564462.com-如何加盟87彩店| www.ua9.cc-河南省快三遗漏数据| www.wl02.com-凤凰彩票网投靠谱吗| www.912111.cc-福彩公益金使用范围| www.988566.com-幸运中彩票-| www.kx64.com-快三代理怎么赚钱| www.444555.com-足彩直播分析| www.65199.cc-乐彩三d藏机图| www.098416.com-彩皇网官网-| www.844997.com-我国体育彩票最早| www.940021.com-吉林快三总盘| www.988349.com-中国甘肃甘肃快三| www.ia.cc-快三平台软件| www.68665.com-福彩10分钟大转盘| www.774464.com-七乐彩机选五注投注| www.829095.com-588彩票-| www.1158.cc-时时彩挂机软件定制| www.9905.org-博彩娱乐-| www.043037.com-竞彩宣传创意| www.043215.com-广西风彩-| www.323261.com-中国体彩网首页官网| www.506677.cc-乐彩网双色球遗漏号| www.89401.com-微信快乐彩二维码| www.79859.com-中港彩票网址多少| www.189075.com-内蒙古赤峰快三开奖| www.36fj.com-七星彩18139| www.0580.bid-福彩3d图迷第一版| www.125158.com-幸运彩票平台| www.go29.com-36选7开奖好彩1| www.31372.com-九号彩票靠谱吗| www.2821.top-中彩官网摇奖机| www.7281.top-画彩虹的图画小学| www.908428.com-9m彩票-| www.aq1.cc-江苏快三同号推荐| www.390629.com-熊猫彩票是什么意思| www.528798.com-凤彩网今日彩票指南| www.62895.cc-福彩快3网官网| www.386038.com-天津七星彩开奖| www.976185.com-河南新乡娶媳妇彩礼| www.aa07.cc-福建快三走势图和值| www.ov68.com-安微福利彩票开奖| www.037984.com-彩票之家登录| www.os0.cc-快三稳赢方法| www.473754.com-福彩3d技巧学堂| www.857616.com-彩之源正规吗| www.944320.com-大联盟彩票如何| www.992300.com-时时彩个位做号技巧| www.ts0.cc-幸运快三怎么看规律| www.oi52.com-高频彩票官方开奖网| www.68853.cc-几个彩票中奖概率| www.55373.cc-国外时时彩-| www.179950.com-福利彩票中奖规则| www.11836.cc-积分换彩-| www.07xo.com-快三是怎么开奖的| www.ct09.com-88彩票骗局-| www.8538.cm-飞腾科技3d彩票机| www.098890.com-分分快三诀窍| www.820460.com-彩钢房顶寿命| www.939338.com-足彩北京单场怎么玩| www.cp1234.cc-三分快三精准计划| www.680653.com-中国体彩老总| www.753007.com-哪些彩票是正规的| www.816147.com-澳门博彩理财骗局| www.876323.com-体彩排列三断组分解| www.928630.com-甘肃快三和值走势| www.972056.com-福彩被破解-| 好运来www.998855k.com| www.aj42.com-够力七星彩新版| www.762125.com-竞彩猫首页-| www.828772.com-乐都彩票下载| www.916648.com-大平台彩票有哪些| www.969184.com-福彩基金效益如何写| 易彩网www.12455x.com| www.627284.com-c9彩票app入口| www.409940.com-鸿运彩票是真的吗| www.qg94.com-好彩双爆多少钱一包| www.009510.com-彩票平台首页| www.073418.com-财神彩票平台| www.150785.com-彩票一等奖交多少税| www.486086.com-打鱼游戏平台送彩金| www.551330.com-凤彩网3d字谜| www.605210.com-机选彩票中奖概率| www.662969.com-123体育彩票| www.717507.com-彩库开奖-|