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.81681.com-快三豹子通选多少钱| www.021205.com-7k彩票app下载| www.607035.com-金龙彩票怎么样| www.32066.com-手机怎样买足球竞彩| www.026107.com-彩票计划网站007| www.181343.com-青海快三历史走势图| www.311843.com-福彩周刊电子报| www.5886.vip-彩神百姓彩票网| www.59382.com-体彩p3试机号今天| www.479303.com-赢彩网怎么样| www.659340.com-昨天七星彩开奖结果| www.806014.com-申航彩票钱怎么出来| www.913850.com-福彩双色球领奖期限| www.46.cx-中国彩吧、图谜| www.299243.com-中彩娱乐登录| www.528742.com-众彩双色球专家预测| www.5212.pw-湖南体彩排三预测| www.bz36.com-昆山快三今天开奖| www.809668.com-彩经彩票可靠吗| www.751.live-时时彩猜数字规律| www.6589.xyz-香港五分跑马彩票| www.2888.in-重庆分分彩官网网址| www.576574.com-彩界之首双色球预测| www.684174.com-248.com彩票| www.6269.biz-彩票刮刮卡印刷厂家| www.766115.com-九号彩票手机客户端| www.886353.com-玩彩最新版-| www.956331.com-七星彩开将结果| 新盈彩www.xinyc8.com| www.25km.com-足球9场胜负彩奖金| www.an62.com-大发快三软件下载| www.is63.com-体育彩票6?1| www.100820.com-必中彩票ⅱ-| www.582669.com-彩色简笔画房子| www.09qt.com-…七乐彩-| www.62hv.com-买彩票软件靠谱| www.1839.org-依彩化妆品好用吗| www.8163.loan-连续发梦中彩票| www.au1.cc-怎么注册快三| www.706807.cc-河南省快三技巧| www.896307.com-9购彩下载-| www.981193.com-彩虹冰淇淋视频| www.qr62.com-富人不买彩票| www.535590.com-属龙今日打彩票| www.1518.com-知名彩票平台| www.848879.com-中国足球竞彩对阵表| www.0264.xyz-时时彩杂六可以追吗| www.722470.com-足彩那种玩法容易中| www.317930.com-中国彩票程序下载| www.572811.com-中博彩票下載| www.727912.com-乐彩175000-| www.637062.com-彩虹七号电池| www.gk32.com-体彩大乐透规则玩法| www.185478.com-江苏快三是赌博吗| www.561005.com-红彩会下载安装| www.661788.com-竞彩中8串1-| www.906305.com-福利彩票有哪些种类| www.tl00.com-最新体彩开奖号码| www.254433.com-爱乐彩票app| www.918841.com-澳门博彩业怎么收税| www.210966.com-五分快三是彩票吗| www.792701.com-西安福彩店转让| www.949320.com-五福彩821cc| www.cp8663.com-福彩3口开奖今天| www.21ng.com-高频彩技巧心得| www.08xj.com-国家许可的网络彩票| www.07ii.com-手绘彩铅樱花树教程| www.995806.com-足彩胜平负公式计算| www.ia84.com-彩票坊能玩吗| www.556612.com-七乐彩复式投注缩水| www.657674.com-彩票软件杀号| www.730977.com-足彩日报必发盈亏| www.815163.com-燕赵风彩新闻| www.890991.com-快三豹子多少倍| www.972101.com-鸿运5分彩开奖| www.cp483.cc-河北快三走势图昨天| www.505631.com-88期福彩中奖号码| www.067777.cc-时时彩个人平台搭建| www.155858.com-彩票30期预测| www.552.pw-中华彩票公益时报网| www.026327.com-彩票开奖时间一览表| www.123055.cc-谦喜彩票网址| www.89751.com-中国福利彩票主任| www.081361.com-蜂鸟团队导师彩票群| www.925553.com-石家庄拓彩美缝剂| www.61308.com-709彩票老版| www.962049.cc-中国福利彩一定牛| www.il73.com-彩票齐鲁风采| www.990590.com-浙江体彩订票系统| www.hk24.com-福彩字谜总汇| www.43194.com-七星彩专家小凤仙| www.184569.com-湖北快三36期开奖| www.285626.com-上海快三和值跨度| www.219406.com-浙江福彩6+1生肖| www.39ym.com-菲律宾彩票包网服务| www.25858.com-彩虹的雅称-| www.531022.com-体彩5d的开奖号码| www.150407.com-新浪数字彩票网| www.312257.com-33彩票平台-| www.872553.com-体彩竞彩比分| www.889141.com-彩神网是不是骗局| www.963056.com-顺势而为彩票软件| www.cp6778.com-大发快三秘籍| www.sp95.com-小鹿多彩开奖网| www.0069.top-体彩个人申请怎么写| www.mb02.com-彩之源彩票平台| www.1440.org-期末美术作品彩铅画| www.962548.com-中彩票全天计划| www.cp9908.com-易彩快3规律| www.578933.com-福彩3d牛彩杀码图| www.700039.cc-五分时时彩是真的吗| www.529310.com-排列三家彩网| www.598028.com-彩票站投资-| www.79ih.com-十亿彩票交易平台| www.365100.com-买彩票是凭运气吗| www.385180.com-盈盈彩票平台| www.kl98.com-时分彩票-| www.59009.cc-中彩易下载地址| www.026680.com-名气最大的黑彩平台| www.88fh.com-彩票粉丝-| www.733183.com-江苏福彩领奖地址| www.846918.com-体彩排三胆码排序图| www.927680.com-彩票咋麦几位数| 火星彩票www.hx8866.com| www.81528.cc-网络博彩骗局| www.256356.com-福彩3d中彩网走势| www.330086.com-3d牛彩网-| www.979961.com-江苏省福彩在哪里| www.257379.com-福彩快三诈骗| www.368957.com-登录大众彩票| 天天彩票www.2373h.com| www.322203.com-彩z网-| www.491406.com-009彩票网下载| www.561228.com-彩票下一期预测| www.619298.com-五一彩票-| www.672108.com-芜湖彩票店转让信息| www.737907.com-棋牌彩金是什么意思| www.796825.com-青蛙彩票app下载| www.858694.com-快三14和值-| www.919357.com-体彩七位数分析预测| www.968467.com-新加坡彩票怎么买| 好彩www.60123x.com| www.cm51.com-梅子福彩3d预测| www.ta32.com-什么彩票是2位数| www.373208.com-南京快三多少期| www.077587.com-快三预测湖北肖立刚| www.176601.com-快三兑奖规则| www.642172.com-时时采彩宝典安卓版| www.048338.com-江苏体彩官网| www.202077.com-彩票过滤软件下载| www.922915.com-体育彩票的盈利| www.799.cm-大六壬测港彩规律| www.6573.xyz-幸运号买彩票| www.365047.com-菲律宾做博彩客服| www.49656.com-福建福彩30选7| www.98759.cc-快2彩票怎么玩法| www.9558.loan-香港时时彩下载| www.948014.com-3d预测号彩宝贝| www.xe17.com-排列三和尾南方双彩| www.184.online-柬埔寨1分彩| www.45627.com-江苏快三在线计划| www.as5.com-大发快三倍投必死| www.701238.com-盈盈彩票app| www.825266.com-竞彩猫女主持人小暖|