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天

知道了
密歇根神奇彩票 www.2325.net-七乐彩连线走势图| www.029806.com-内蒙古体彩发行中心| www.612821.com-d8彩票是黑彩吗| www.9180.com-我要查看七乐彩彩票| www.042101.com-速赢彩票是合法的吗| www.403033.com-时时彩推波玩法表格| www.297.live-领航彩票程序| www.la61.com-福彩通-| www.36hm.com-北京彩票快3| www.97322.cc-古建筑彩绘标准| www.795199.com-五分彩开奖有规律吗| www.907567.com-长春体彩客服| www.994382.com-彩票生成器代码| www.bx87.com-双彩开奖走势图| www.40628.com-微信上的中彩| www.103234.com-体彩超级大乐透玩法| www.17925.cc-彩店宝下架了吗| www.876437.com-掌上京彩app下载| www.54ld.com-98彩票登录导航| www.57ta.com-彩票花呗平台| www.072801.com-怎么去实体店买彩票| www.518708.com-双色中彩网彩网| www.632890.com-福彩时时彩和值奖金| www.927056.com-350彩票正规吗| www.998948.com-靠谱的竞彩app| www.cs26.com-时时彩平台是真的吗| www.xq62.com-彩票中奖查询35期| www.42626.com-秒彩苹果下载| www.29iq.com-彩票王成周后来| www.6770.shop-福彩奖池现在有多少| www.35506.com-长城彩票下载| www.95144.com-彩票内部人员给号码| www.120245.com-久久发彩票官方网站| www.59rp.com-福利彩票游戏可靠吗| www.139011.com-同城体育彩票网| www.259559.com-七星彩随机选号器| www.63137.com-2019年彩礼标语| www.142133.com-三不同福利彩票规则| www.234154.com-安徽福彩中心| www.005443.com-云彩店app下载| www.920045.com-彩票摇-| www.130592.com-湖南福彩发行中心| www.59221.cc-福彩三d计算方法| www.369209.com-尼彩手机好么| www.34962.com-彩神好喷绘机| www.563736.com-福彩奥运3d图谜| www.662228.com-彩票拉人方法大全| www.853954.com-竞猜体育彩票开始| www.051225.com-彩票合买规则| www.192200.com-江苏快三开奖软件| www.224585.com-最励志的彩票宣传语| www.25199.cc-彩铅画的画怎么画| www.008726.com-安徽体彩11选5图| www.111621.com-彩票平台推荐一下| www.602280.com-欧美190的彩票| www.748005.com-甘肃福彩快三奖池| www.853798.com-分分彩倍投计划表| www.949853.com-下载大彩网-| 幸运彩票www.669307.com| www.zd61.com-红牛彩票网址| www.900064.com-657彩票登录| www.32008.com-体彩佣金转额度| www.000270.com-多彩网彩票网页| www.970018.com-彩票和双色球的区别| www.eo01.com-快三内蒙预测| www.6303.vip-彩涂钢板图片| www.831321.com-神马六给彩2019| www.900052.com-天天竞彩彩票下载| www.963884.com-雨后彩虹是什么意思| www.ag9.cc-北京快三怎么选和值| www.353953.com-彩票买的多能优惠吗| www.150540.com-快三软件计划手机版| www.313072.com-体彩排列5开奖查询| www.450337.com-3k彩票是真的吗| www.34298.com-彩铅画教程入门| www.42qz.com-苹果x原彩模式| www.296951.com-澳门彩票手机版| www.25561.cc-彩票投注技巧与方法| www.489633.com-国家禁止售卖彩票| www.993349.com-足彩19038期| www.26399.cc-3d报纸彩图-| 博乐彩票www.35918s.com| www.99jd.cc-福彩3d五行算法| www.84443.cc-彩钢生产厂-| www.117796.com-彩票倍投计算机| www.332207.com-鸿运彩票-| www.17711.cc-有没有人用彩票软件| www.79599.cc-皇冠足彩网站| www.263940.com-福彩开奖500| www.068.cm-腾讯彩票游戏| www.46607.com-最稳定的时时彩网址| www.158001.cc-带加奖的体彩app| www.225576.com-提现快彩票-| www.pe86.com-快三输钱-| www.22503.com-玩彩靠谱平台| www.67846.com-打彩票输钱了怎么办| www.716464.com-彩铅星空画-| www.836844.com-湖北省福彩网| www.932128.com-彩票公式杀码软件| www.669764.com-海南私彩现状| www.778811.com-查银海彩报-| www.562323.com-彩吧网论坛首页| www.2118.biz-体育彩票打广告词语| www.sy65.cc-彩票黄金分割揭秘| www.551375.com-足彩数剧爱彩网| www.107013.com-瑞彩祥云秘籍| www.42ng.com-竞彩哪个靠谱| www.261915.com-大陆平台彩票送彩金| www.902795.com-彩票任务代打| www.971888.com-8号彩票有聊天室的| www.cp524.com-内蒙快三专家推号| www.360105.com-龙岩体彩中奖情况| www.532371.com-买彩票中奖秘籍| www.939027.com-发财网彩票-| www.2ch.cc-快三注册推荐码| www.711511.com-小鹿工具时时彩| www.567796.com-香港濠江天空彩票| www.5696.biz-第一彩票骗局| www.4013.net-澳彩低于香港马会| www.229010.com-三分彩规律-| www.551417.com-体彩排五合买网| www.412041.com-鸿运当投彩票| www.543259.com-玩彩老头双色球| www.627277.com-旺彩平台下载| www.832266.com-破解彩票伪随机数| www.967164.com-神彩通金码关注码| 68彩票www.68682h.com| www.659110.com-七星彩这期出什么奖| www.731364.com-彩票打码兼职| www.795536.com-中图福利彩票双色球| www.873489.com-网易购彩合法吗| www.924825.com-穷人买彩票中奖| www.970532.com-攻破彩票-| 梦想彩票站www.43131h.com| www.102374.com-好彩生肖数字| www.099049.com-福利彩票3d之家| www.986500.com-中国体育竞猜彩票| www.163747.com-中华彩票首页| www.059679.com-快三选号的图| www.135031.com-彩金网-| www.t99.org-北京时时彩彩票平台| 大赢家彩票网www.178153.com| www.121487.com-玩时时彩心得| www.959826.com-快三平投怎么赚钱| www.ri97.com-彩运8网登录| www.292466.com-体彩开奖中奖规则| www.365270.com-广西快三有几种吗| www.53335.com-彩虹六号职业战队| www.013645.com-全民8彩票app| www.080362.com-七星彩梦兆查询| www.240233.com-神彩争霸下载地址| www.335646.com-福建快三未出号| www.420878.com-3d2元彩票网| www.956666.com-百采网百彩网| www.cp768.com-玩快三的app| www.36gn.com-彩票3d中2d-| www.3077.pro-七星彩by明月珰| www.8989.in-中圄竞彩网首页| www.30ph.com-最新彩虹世界安卓版| www.3066.cc-四场进球彩的玩法| www.27220.com-新2彩票公式| www.87701.com-大资本彩票官网| www.104121.com-竞彩直播500| www.037708.com-安徽快三和值详细|