QQ客服
当前位置 : 首页 > 代码 > 网页特效 > 选项卡/滑动门 > jquery简洁的tab选项卡切换代码

原创商用 jquery简洁的tab选项卡切换代码

基于jquery.SuperSlide插件制作简洁的选项卡鼠标滑过TAB切换效果,SuperSlide插件扩展性强,方面其它功能使用,下载即可使用。
分享到微信朋友圈
X
[声明]该素材是本站付费买断的作品代码,享受著作权保护,未经允许请勿转载,否则追究相应的法律责任。

使用方法:

1、head引入css文件

<link href="css/style.css" rel="stylesheet" type="text/css"/>

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代码

<div class="change-content change-box">
	<div class="change-main">
		<div class="change-cut flex-row">
			<ul class="clearfix">
				<li class="transition tab on">我们的承诺</li>
				<li class="transition tab">我们的实力</li>
				<li class="transition tab" style="border-right:0">我们的角色</li>
			</ul>
		</div>
		<div class="contents clearfix">
			<div class="content flex-row" style="display: block;">
				<a href="#"  target="_blank">
					<div class="item flex-rows">
						<div class="img-block"> <img src="images/icon-svg-009.svg" alt="img"> </div>
						<div class="item-block">
							<p class="item-title">7*24小时售后支持</p>
							<p class="item-p">全国7x24小时客服热线</p>
						</div>
					</div>
				</a>
				<a href="#">
					<div class="item flex-rows">
						<div class="img-block"> <img src="images/icon-svg-010.svg" alt="img"> </div>
						<div class="item-block">
							<p class="item-title">100倍故障时长赔偿</p>
							<p class="item-p">100倍赔付终端服务时间</p>
						</div>
					</div>
				</a>
				<a href="#">
					<div class="item flex-rows">
						<div class="img-block"> <img src="images/icon-svg-011.svg" alt="img"> </div>
						<div class="item-block">
							<p class="item-title">15天无理由退款</p>
							<p class="item-p">部分产品可享受15天无理由退款</p>
						</div>
					</div>
				</a>
				<a href="#">
					<div class="item flex-rows">
						<div class="img-block"> <img src="images/icon-svg-012.svg" alt="img"> </div>
						<div class="item-block">
							<p class="item-title">多对一团队服务</p>
							<p class="item-p">全国80家分公司便捷服务</p>
						</div>
					</div>
				</a>
			</div>
			<div class="content flex-row" style="display: none;">
				<a href="#" target="_blank">
					<div class="item flex-rows">
						<div class="img-block"> <img src="images/icon-svg-005.svg" alt="img"> </div>
						<div class="item-block">
							<p class="item-title">19年历史</p>
						</div>
					</div>
				</a>
				<a href="#" target="_blank">
					<div class="item flex-rows">
						<div class="img-block"> <img src="images/icon-svg-006.svg" alt="img"> </div>
						<div class="item-block">
							<p class="item-title">80家分公司</p>
						</div>
					</div>
				</a>
				<a href="#" target="_blank">
					<div class="item flex-rows">
						<div class="img-block"> <img src="images/icon-svg-007.svg" alt="img"> </div>
						<div class="item-block">
							<p class="item-title">1000名设计师、工程师</p>
						</div>
					</div>
				</a>
				<a href="#" target="_blank">
					<div class="item flex-rows">
						<div class="img-block"> <img src="images/icon-svg-008.svg" alt="img"> </div>
						<div class="item-block">
							<p class="item-title">120万客户</p>
						</div>
					</div>
				</a>
			</div>
			<div class="content flex-row" style="display: none;">
				<a href="#" target="_blank">
					<div class="item flex-rows">
						<div class="img-block"> <img src="images/icon-svg-001.svg" alt="img"> </div>
						<div class="item-block">
							<p class="item-title">同行</p>
							<p class="item-p">持续陪伴企业成长,共创,共赢</p>
						</div>
					</div>
				</a>
				<a href="#" target="_blank">
					<div class="item flex-rows">
						<div class="img-block"> <img src="images/icon-svg-002.svg" alt="img"> </div>
						<div class="item-block">
							<p class="item-title">赋能</p>
							<p class="item-p">帮助企业建立智能经营的能力</p>
						</div>
					</div>
				</a>
				<a href="#" target="_blank">
					<div class="item flex-rows">
						<div class="img-block"> <img src="images/icon-svg-003.svg" alt="img"> </div>
						<div class="item-block">
							<p class="item-title">连接</p>
							<p class="item-p">为企业连接一切潜在商业价值</p>
						</div>
					</div>
				</a>
				<a href="#" target="_blank">
					<div class="item flex-rows">
						<div class="img-block"> <img src="images/icon-svg-004.svg" alt="img"> </div>
						<div class="item-block">
							<p class="item-title">开放</p>
							<p class="item-p">面向所有企业和伙伴开放共享</p>
						</div>
					</div>
				</a>
			</div>
		</div>
	</div>
</div>

<script type="text/javascript">
	jQuery(".change-main").slide({ titCell:".flex-row li", mainCell:".contents",delayTime:0 });
</script>
[声明]本站素材来自用户分享,仅限学习交流请勿用于商业用途。如损害你的权益请联系客服QQ:2447402004给予处理。
举报×
举报原因:

相关代码

二维码
意见反馈
×
×

注册

QQ注册 立即下载 新浪注册 立即下载

签到成功!

已连续签到1天,签到3天将获得积分VIP1天

知道了
9彩注册 www.43202.com-百乐彩手机版客户端| www.1203.vip-五分快三吧-| www.8472.cc-易彩注册测速| www.806711.com-彩票和值投注技巧| www.898972.com-外卖送彩票方案| www.987202.com-广西福彩兑奖服务处| www.ys5.cc-广西快三最大遗漏| www.rm94.com-基诺彩的诀窍| www.008756.com-竞彩对阵表-| www.95793.com-彩票公益基金| www.103232.com-旺彩大乐透官方下载| www.565392.com-福彩专家詹天佑预测| www.2688.me-牛彩平台登录| www.09628.com-福彩专业玩彩胡先生| www.58539.cc-中彩在线官网| www.45bk.com-彩虹果酱冰淇淋机| www.389385.com-福彩三d今天的图纸| www.512321.com-星彩代挂平台| www.598601.com-我乐时时彩计划官网| www.701057.com-南通彩艳纺织| www.782119.com-彩票中的数学奥秘| www.878166.com-福彩图迷总汇牛材网| www.955643.com-中国足彩竞猜官网| www.447430.com-福彩票三滴-| www.567450.com-快三顺子中了多钱| www.639302.com-彩票店彩票安卓| www.723766.com-智博微彩网-| www.810511.com-博乐彩票下载| www.886704.com-超级福彩骗局| www.964219.com-卖体彩赚钱-| www.hc.cc-安徽快三分析预测| www.13099.cc-吉林长春快三住手下| www.63283.com-彩票网站送18| www.23854.com-快三单跳双跳| www.19891.com-竞彩足球推荐彩乐乐| www.p99.vip-网上彩票钱取不出来| www.9070.in-福彩30选七开奖号| www.107058.com-跑马三分彩-| www.318889.com-抚州中彩票-| www.771589.com-扑克彩票3开奖结果| www.874850.com-拉菲国际彩票| www.981138.com-牛牛彩票网骗局揭秘| www.jq15.com-网络购彩-| www.725625.com-彩票ios签名| www.60100.com-数字彩大数据统计| www.295168.com-彩票数学公式大全集| www.974512.com-体彩大乐透选号规则| www.nx61.com-快三赚钱团队| www.934224.com-太子彩票app| www.dm3.com-时时彩高手倍投方案| www.bb61.com-今天福体彩开奖结果| www.yk19.com-南洋彩开奖网站| www.hr74.com-彩票app下载苹果| www.372699.com-欢腾彩票是正规的吗| www.631815.com-恒彩88平台登录| www.iw63.com-浙江体彩网公告| www.362707.com-二等奖彩票-| www.561813.com-新彩计划网址| www.342222.com-长春彩溢2019| www.y23.org-苹果版彩票-| www.172424.com-福彩快三骗局揭秘| www.246826.com-上海福彩中心官网| www.912051.com-威胁黑彩平台报警| www.029544.com-利彩可以相信不| www.782318.com-快三大小怎么看| www.866381.com-昨日体彩开奖结果| www.934897.com-彩之堂彩票app| www.988086.com-必中彩票出现漏洞| www.be17.com-摇一摇机选彩票| www.up01.cc-甘肃快三爱乐彩| www.00os.com-赞美雨后彩虹的诗句| www.568953.com-彩票快开游戏如何改| www.334191.com-有正规的福彩快三吗| www.467554.com-福彩红球有几个号码| www.657044.com-彩贝游戏老虎机平台| www.802722.com-下载福彩感恩app| www.938334.com-试机号双色球开门彩| www.sy93.cc-彩票平台那个好| www.75kp.com-足彩最多能买多少棵| www.543292.com-福彩大家乐官网| www.658590.com-范伟买彩票中的号码| www.755845.com-江苏快三破解方法| www.843311.com-愤怒小鸟玩足彩微博| www.903673.com-中国体彩票开奖号| www.973677.com-鼎丰彩票官网| www.ix19.com-合肥快三开奖| www.1896.com-时时彩组六投法| www.18905.com-ui领先彩票登录| www.016213.com-苹果x原彩显示在哪| www.170992.com-长春快三开走势图| www.349737.com-乐彩网白袍法师图集| www.497725.com-0818彩票推荐人| www.85481.com-彩票系统全套源码| www.109863.com-帝王彩票-| www.240133.com-五分彩反计划怎么买| www.414741.com-重听今天天天福彩| www.667669.com-香港有线球彩| www.834222.com-电子彩烟介绍| www.984718.com-好彩123彩票| www.25uu.com-女孩总是叫陪她玩彩| www.786610.com-8848彩票网-| www.49597.com-福彩3d彩报第二版| www.33971.com-彩票回血是真的吗| www.244120.com-福彩p62走势图| www.564111.com-彩票计算机器人| www.21715.cc-加微信玩彩票| www.526552.com-5k彩票登录客服| www.1373.hk-简单水彩抽象画| www.884513.com-裆利3d彩吧图全图| www.964473.com-竞彩足球-百度| 大赢家彩票网www.83033j.com| www.62ad.com-胜负彩概率-| www.991635.com-旺彩预测电脑版| www.gn19.com-山东各地彩礼价格表| www.2ru.com-k彩游戏下载图| www.9789.online分分彩倍投-| www.015714.com-够力七星彩旧版本| www.287661.com-福彩群英会扫码下载| www.383437.com-福利彩票今晚| www.513589.com-时时彩二星杀号| www.621093.com-红旗彩票软件| www.698834.com-油性彩铅画星空教程| www.784455.com-网络彩票-| www.15421.com-彩库宝典正版下载| www.606268.com-玩久久久久玩时时彩| www.712408.com-东北娶媳妇彩礼| www.797382.com-c99彩票怎么退钱| www.881203.com-日彩网平台-| www.982374.com-重新时时彩开奖号码| www.637507.com-福彩公益金济宁| www.735261.com-初玩彩票怎么玩| www.796064.com-界青金彩海晏| www.855168.com-体彩有什么彩种| www.919761.com-彩票打印机原理| www.972612.com-天马彩票骗局| 优点彩票www.137101.com| www.7327.biz-彩虹六号围攻新手| www.885043.com-9号彩票网网址| www.927378.com-如何买体育彩票| 彩乐乐www.cll168.com| www.l42.com-彩神称霸ll-| www.94rw.com-有没有好的足彩软件| www.3692.biz-福彩3d三星缩水| www.03375.com-为什么喜欢买彩票| www.51782.com-青蛙彩票导航网网站| www.88986.cc-福利彩票店转让合同| www.030640.com-彩票大小单双违法吗| www.095313.com-手机买足彩-| www.148099.com-中彩票后的小说| www.104062.com-安徽七乐彩开奖结果| www.230882.com-11选5购彩软件| www.802416.com-体育彩票胜平负机号| www.37899.com-福彩3d多久开奖| www.235783.com-山东福彩群英会| www.526592.com-北京报亭可以买彩票| www.012890.com-7星彩走势-| www.917957.com-必赢彩票吧-| www.ai89.com-星期六什么彩票开奖| www.00aw.com-体彩乐透-| www.vw19.com-乐购彩票平台合法吗| www.iu80.com-竞彩足球预测中国网| www.10rt.com-彩铅画动物图片| www.70ep.com-安微快三和值推荐| www.271621.com-一定牛体育彩票官网|