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天

知道了
亚洲28 www.456853.com-彩票刷单-| www.980008.cc-彩票担保人-| www.nc16.com-网络可以售彩吗| www.2539.pw-什么是打彩票| www.507071.com-竞彩猫可以赚钱吗| www.99vj.com-福彩今日字谜凤彩网| www.236308.com-e球彩基本走势图| www.22056.com-烟台福彩招远站| www.559032.com-棒棒彩票下载app| www.33.me-福利彩票新规则| www.379267.com-宝马彩票案黑幕| www.655002.com-辣椒七星彩-| www.112730.com-彩神安徽快三安卓版| www.796336.com-怎样制作竞彩表格| www.102398.com-台湾乐透彩资料大全| www.247677.com-天天快三靠谱吗| www.20514.cc-大发快三私带导师| www.69780.com-易彩乐是真的吗| www.701730.com-中国福利彩票手机端| www.801139.com-福利彩票开奖说明| www.881591.com-百胜9b彩票网站| www.953103.com-世界杯体彩app| 天天彩票www.7782r.com| www.ef56.com-河北快三豹子规律| www.801758.com-奔驰彩票官网qq| www.926173.com-500万彩票预测| www.985394.com-彩票竞猜微信公众号| www.sf1.com-重庆彩票网官网| www.172312.com-安微快三跨度走势图| www.700489.com-可变条码彩票定制| www.948701.com-微信带玩江苏快三| www.349788.com-彩民卡客户端| www.511065.com-雨后彩虹个性繁体字| www.654092.com-江西快三一天几期| www.806771.com-竞彩蓝球投注计划| www.947299.com-一分快三必中计划| www.bf45.com-淘宝彩票下载| www.04sn.com-彩铅画技法-| www.6925.xyz-49彩票网-| 福运www.fyyy3.com| www.948.win-福彩三d热议| www.625719.com-彩票那种奖金高| www.738700.com-购买黑彩被骗报警| www.868595.com-七星彩合值走试图| www.cai5299.com韩国快三走势图| www.e72.club-七乐彩奖金分配等级| www.916981.com-信阳合买彩票中| www.994857.com-彩票随机号生成器| www.ha25.com-幸运时时彩开奖记录| www.n11.cn-热购彩票app| www.947531.com-福彩视频讲座| www.cp450.com-一分快三怎么样能赢| www.ty79.com-彩票屠龙记-| www.66640.com-奥客网竞彩篮球比分| www.8897.in-彩票平台怎么赚流水| www.za63.com-体彩5d开奖走势图| www.669.club-今天3d彩报第二版| www.444257.com-福彩3d和值规律| www.3066.cc-四场进球彩的玩法| www.678414.com-8彩吧-| www.716970.com-彩铅配色-| www.395014.com-香港天空彩与您同行| www.007584.com-体彩中奖号码七位数| www.9994.loan-万彩办公大师| www.362867.com-丹东三d彩涂精华版| www.464699.com-查福彩试机号码| www.844402.com-东东彩票-| www.317076.com-多期彩票怎么兑奖| www.088306.com-北京单场足彩推荐| www.220144.com-中彩网擂台赛| www.990528.com-关于全球彩票基乐彩| www.419413.com-必发彩票是不是黑彩| www.09651.com-11006移动彩票| www.172937.com-福彩布衣2-| www.52005.com-吉林快三开奖奖金| www.019267.com-遵义彩票中奖| www.193059.com-今日多乐彩走势图| www.571680.com-吉林快三四码黑| www.738789.com-金利娱乐彩票手机版| www.cp0411.com-一分钟快三计算软件| www.56572.cc-彩票53网-| www.371971.com-彩加x八幡肉| www.503510.com-红彩网直播间| www.589083.com-七星彩共有多少组| www.675392.com-乐彩娱乐-| www.610186.com-彩777官网下载| www.701981.com-远洋竞彩app| www.799373.com-彩票能不能中奖| www.882867.com-网上兼职彩票刷流水| www.950496.com-必中彩票2-| 福彩www.2109h.com| www.86699.cc-六彩开奖历史记录| www.94bu.com-香港正版彩图| www.765121.com-七星彩早版小精英| www.889052.com-足彩受让是什么意思| TT彩票www.526013.com| www.602789.com-福建体彩官网下载| www.670144.com-南粤风彩好釆3| www.737965.com-凤凰彩票怎么赚流水| www.806032.com-九五彩票下载安装| www.875422.com-彩票梯子游戏注册| www.938778.com-亿彩网址登陆| www.rs29.com-彩票app破解方法| www.11xs.cc-甘肃快三数据分析| www.031979.com-我爱彩票软件| www.75876.cc-体彩彩票开什么| www.8445.com-彩票纷争-| www.508335.com-v竞彩-| www.587415.com-下载竞彩之家app| www.659484.com-最正规的彩票网站| www.758832.com-彩票加盟代理找谁| www.815422.com-吉林快三一百期| www.875660.com-恒大彩票注冊| www.l43.com-彩神通关注码及金码| www.920758.com-幸运5分彩可信吗| www.984053.com-老猫治彩-| www.kt7.com-分分快三走势图| www.4889.xyz-足彩大数据软件| www.38252.cc-万人炸金花彩票| www.254038.com-反水最高的彩票平台| www.476636.com-福少时时彩官网| www.225112.com-宝马彩app下| www.56509.com-彩票怎么计划的| www.13442.com-竞彩8串9容错几场| www.92212.cc-好彩三万能码| www.594978.com-京东彩票客户端| www.024395.com-天天时时彩-| 大赢家彩票www.599641.com| www.722215.com-美食彩铅作品| www.681260.com-天天中彩怎么提款| www.777722.com-头彩网登录-| www.898073.com-彩票代理拉人骗局| www.980325.com-709彩票苹果| www.bd5.com-彩票赚钱-| www.33265.com-安徽竞彩快三| www.89852.com-c85彩票-| www.a51.cc-胜负彩技巧-| www.026039.com-爱彩人彩票网走势图| www.499419.com-福利彩票如何申请| www.588311.com-波彩之家客服| www.680695.com-爱中彩网站-| www.761724.com-新浪彩网开奖| www.855138.com-天天爱彩票提现| www.940772.com-凤凰彩票在线计划| www.999417.com-100彩票app-| www.qd46.com-彩94app-| www.12fd.com-重庆时时彩作弊刷钱| www.428816.com-福彩双色球大奖| www.523250.com-呼市福利彩票双色球| www.903806.com-彩票竞猜金豆游戏| www.222381.com-全天幸运快三计划| www.619965.com-中国福利彩票邓| www.636265.com-彩虹糖机-| www.744163.com-重庆福彩抽奖| www.803483.com-体彩61玩法规则| www.873184.com-彩票胆拖好吗| www.929599.com-蛙牛彩票17500| www.983464.com-彩票带计划是真是假| www.ag51.cc-熊猫彩票是黑平台吗| www.sg00.com-优乐时时彩-| www.16nd.com-优乐彩下载安装| www.126000.cc-彩九为什么下载不了| www.199457.com-福彩专家预测| www.259635.com-福彩选号器助手|