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.50732j.com| www.7093.live-七彩联盟有哪些学校| www.39yy.cc-七星彩500特| www.2940.org-彩票每天盈利图| www.7764.cm-九度彩票是骗局吗| www.47199.cc-东北结婚彩礼| www.110030.com-广东体育彩票一定牛| www.215383.com-彩票360走势图| www.xc74.com-977彩票网页| www.6982.net-买的彩票如何注销| www.71036.com-搜狐彩票开奖| www.168627.com-江苏快三怎么玩| www.196068.com-内快三爱彩乐| www.w28.org-七乐彩刘远-| www.55gf.com-篮球竞彩群推荐| www.218723.com-刷彩票-| www.xa53.com-5分快三怎么看走势| www.771005.com-时时彩彩票代理返点| www.891567.com-彩票如何网上推销| www.975639.com-彩19彩票-| www.cp9998.cc-福彩3d走势图表| www.1to.cc-彩色铅笔花边| www.2375.vip-体彩第18154期| www.968166.com-怎么举报时时彩| www.cai1088.com江苏快三是骗局吗| www.mr05.com-河北体彩网官方网站| www.74446.com-中国足彩中心| www.j47.cc-武汉市福利彩票中心| www.454658.com-万达彩票平台| www.570365.com-昆明七彩云南图片| www.654143.com-快三二同号买法| www.724861.com-中彩彩票在哪里| www.796412.com-尊彩网官方-| www.870809.com-广东省福彩发行中心| www.941213.com-广州市福彩中心| www.994160.com-炫彩背包-| www.ar02.com-手机打彩票-| www.983629.com-河南福彩怎么兑奖| www.465041.com-足彩如何跟单能赢| www.42xj.com-招聘彩票计划员| www.4660.cc-充值1元彩票| www.860388.com-彩票计划9cb| www.992468.com-江苏体彩竞彩足球| www.gb01.com-快三玩法-| www.754655.com-时时彩倍投公式算法| www.16666.cc-沈阳体彩中心| www.54fa.com-赢发快三彩票网址| www.234815.com-中国竞彩网竞彩足球| www.309502.com-榆次体彩中心| www.377164.com-腾讯时时彩计划板| www.498822.com-七乐彩独胆汇总预测| www.268315.com-彩涂铝板用途| www.363534.com-彩虹的另一层含义是| www.454813.com-快乐双彩开奖规则| www.b97.club-北京快三爱乐彩| www.81gv.com-体育彩票大乐怎样卖| www.3114.pw-吉林省彩票中奖| www.40936.com-老虎彩票中了不给钱| www.000974.com-竞彩258论坛| www.110531.com-广东福利彩票5分钟| www.638882.com-上海体彩哪里申请| www.025407.com-天天彩选三开奖结果| www.444772.com-晋城彩票站转让| www.97575.com-彩要开奖结果查询| www.129037.com-吉林新快三开奘结果| www.223969.com-十分钟福彩中奖技巧| www.328370.com-福彩预测3d论坛| www.294191.com-01彩票能提现么| www.413287.com-彩色沥青路面| www.507653.com-福彩又-| www.621139.com-福彩连连看属于哪的| www.072.com-利彩你资源站| www.fw35.com-5亿彩app-| www.wy47.com-万彩吧c8cn高手| www.01fw.com-生日彩票计算器下载| www.869975.com-安薇快三开奖| www.08pz.cc-长沙体彩代理| www.4856.cm-梦见自己买彩票| www.095052.com-新彩吧开奖结果| www.166490.com-快三开奖结果江西| www.237402.com-国家体育彩票app| www.302009.com-湖北福彩中心| www.010053.com-福彩3d遗漏-| www.129142.com-陕西福彩双色球玩法| www.455116.com-金冠彩票软件| www.874475.com-老谢说彩双色球定位| www.377671.com-红彩彩票网站| www.657106.com-彩票坊平台下载| 18W彩票www.309135.com| www.224655.com-公益福彩快三合法吗| www.873451.com-体彩可以开竞猜吗| www.374288.com-郑州福彩大厦| www.790762.com-彩票随机模拟器| www.948163.com-千亿彩票手机版下载| www.26hb.com-买彩票中了一千万| www.v50.top-诚信彩票网抢红包| www.0435.xyz-香港有体彩吗| www.ir74.com-福彩手机购彩平台| www.757111.cc-创富彩票是陷阱吗| www.870773.com-彩票投资指南pdf| www.965468.com-百盈时时彩开奖号码| www.eh76.com-福彩三地开奖| www.652186.com-中国体彩网开奖号| www.857376.com-互娱彩票在线| www.17195.cc-二元投资买彩票笑话| www.52955.com-黑彩庄家跑路| www.076198.com-江西福利彩票双色球| www.248360.com-外蒙快三-| www.503888.com-节目彩排感想| www.929773.com-北京全民星彩科技| www.gj02.com-汉中快三秒电话| www.798508.com-彩票中奖如何交税| www.2799.net-关于彩票的图片大全| www.023852.com-彩票类完结小说| www.175878.com-快三开挂作弊下载| www.422776.com-体彩店投入多少钱| www.561702.com-鸿彩公-| www.970952.com-如何才能成为彩托| www.748478.com-红彩网从哪下载| www.ti32.com-360购彩彩票大厅| www.16136.com-竞彩足球直播吧| www.72268.cc-彩票烂了能重新打印| www.bs96.com-最新的彩票缩水软件| www.29gj.com-体彩排列三中奖结果| www.456940.com-中国福利彩票三b| www.723212.com-彩票开奖三地关注码| www.925146.com-北京长乐快三查询| www.999879.com-网易彩票4.29| www.53ln.com-福彩高频彩是啥| www.175857.com-快三追号神器| www.224426.com-微信上的福彩快三| www.642906.com-七乐彩开机-| www.40417.com-体彩江西11选5| www.819298.com-体彩高手-| www.50hd.com-职业彩民心得故事| www.234705.com-彩500是什么软件| www.496801.com-六爻测3d彩票方法| www.8686.vip-福利彩和体育彩| www.6695.top-福彩代打是什么| www.031680.com-七星彩历史号码查询| www.974894.com-彩票投注站电话号码| www.7162.win-七彩阳光视频教学| www.572511.com-真精华布衣好彩网| www.096234.com-四川省体彩中心地址| www.323287.com-乐和彩票app下载| www.668525.com-博彩客服工作内容| www.768831.com-共享彩票最高倍率| www.859822.com-彩票体育彩票大乐透| www.940991.com-快三是官方的吗| 超级彩票www.900122.com| www.pj30.com-彩票高手中奖秘诀| www.04wg.com-儿童彩铅绘画图片| www.977104.com-彩礼的范畴-| www.353006.com-哪个平台还能买彩票| www.449225.com-体育彩票中途卖| www.678032.com-福盈门彩票黑吗| www.777046.cc-彩宝宝诈骗-| www.904728.com-买彩票的软件叫什么| www.1165.vip-网络彩票宣传语| www.495115.com-济南彩票站转让信息| www.571392.com-吉林快三什么计划网| www.657479.com-亿彩网安卓版下载| www.8061.org-陈流水彩范画视频| www.679107.com-博彩套利论坛|