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.455513.com-中乐彩靠谱么| www.400035.com-礼拜三开什么彩票| www.594820.com-维彩会-| www.751005.com-福彩时时彩赚钱技巧| www.177955.com-青海快三开奖查询| www.971725.com-创彩网买彩票安全吗| www.76zn.com-重庆彩票站哪里中了| www.973241.com-c798彩票-| www.69006.com-上海体彩中心官网| www.32sl.com-2017够力七星彩| www.6142.vip-彩票协会-| www.157.me-微信彩虹昵称| www.7778.loan-竞彩足球投注方式| www.356406.com-博雅彩票苹果版| www.461144.com-时时彩自动投注软件| www.700926.com-新型体彩店-| www.ce8.com-好彩三奖金-| www.261032.com-彩票随机买能中奖吗| www.120175.com-体育彩票比分直播| www.019574.com-贵阳体彩十一选五| www.527261.com-香港财神彩神网站| www.542233.com-购彩平台信誉好的| www.023571.com-77彩票app下载| www.2751.wang-彩票十元倍率什么放| www.304498.com-甘肃体彩排三| www.8153.wang-信彩开奖官方网站| www.658345.com-87彩店官网网址| www.873726.com-七乐彩300-| www.bb71.com-内蒙古福彩中心地址| www.0317.cn-银彩通app下载| www.662298.com-七星彩摇奖现场直播| www.3303.biz-国外体彩-| www.994422.cc-非法经营彩票网站罪| www.kh05.com-山东彩票开奖结果| www.902.in-感觉彩票33是坑| www.52538.cc-彩票秘籍公式| www.047771.com-彩票计算公式| www.2391.win-彩票开奖音乐试听| www.062906.com-易彩票下载苹果版| www.499396.com-分分彩挂机安卓版| www.kt24.com-上海福利彩票双色球| www.910046.com-云南昆明彩砖| www.999224.com-竞彩足球预测| www.cc40.com-福建11选5爱彩乐| www.057725.com-福彩胆码和杀码| www.144987.com-竞彩延期官网首页| www.238281.com-发彩网可靠吗| www.3865.cm-彩票机虚假出票| www.7830.pw-竞彩足球可以玩吗| www.317661.com-胜负彩彩民心得| www.066966.com-甘肃快三和值彩经网| www.916.com-七星彩连中4个号码| www.980008.cc-彩票担保人-| www.63891.cc-胜负彩14场都中了| www.033445.com-快三豹子通中多少钱| www.325663.com-南国七星彩彩坛| www.120786.com-体彩31选七走势图| www.dx3.com-牛材网彩票-| www.357945.com-彩票提点多少| www.440136.com-体彩网购app| www.5080.cm-彩友会公平公正公开| www.78781.com-彩吧彩票买大小| www.054160.com-yy彩票平台-| www.154401.com-足球博彩入门知识| www.248316.com-08彩票-| www.670496.com-今晚七星彩推荐号码| www.751724.com-开心彩票app下载| www.843231.com-足彩技术分析| www.902512.com-亚朵网国彩票合法吗| www.983465.com-青海省快三走势| www.182736.com-新3d彩-| www.qu74.com-快三多久开一次| www.631891.com-七彩光谱-| www.704903.com-彩票app送30| www.776771.com-重庆时时彩几点停止| www.679901.com-魔方彩票苹果| www.794177.com-福彩3d跨度算法| www.889858.com-七乐彩那一年发行| www.tb5.cc-福彩三d开奖| www.yt86.com-今日湖北快三推荐| www.303042.com-七星彩2255期| www.383119.com-大乐透彩票能折叠吗| www.517560.com-香港皇冠彩票| www.579350.com-趣9购老彩票老套子| www.64459.com-数字竞彩诈骗| www.052326.com-彩票代理能赚钱吗| www.696.biz-竞彩足球推荐310| www.145114.com-什么是基诺型彩票| www.446767.com-优彩师怎么样| www.550111.com-宝发彩票代理| www.538922.com-欢迎使用必赢版彩票| www.263744.com-百度贴吧彩票| www.007350.com-幸运彩3132下载| www.113003.com-竞彩猫怎么挣钱| www.269115.com-人人中彩票安卓版| www.336377.cc-微信登录彩票软件| www.809655.com-多彩网官方网站| www.887391.com-彩票开奖漏洞破解| www.957863.com-七星彩包码-| 梦想彩票www.33112q.com| www.95ib.com-kk彩票平台正规吗| www.528127.com-破解极速时时彩软件| www.111389.com-盈彩官网下载| www.193563.com-幸运彩票快三三分彩| www.262398.com-皇都彩票登陆| www.362362.com-彩虹这首诗怎么写呢| www.128439.com-福彩官方网-| www.v23.xyz-南洋乐和彩公告| www.147484.com-彩999彩票官方网| www.288756.cc-双色球彩票用语| www.369443.com-福利彩票双色球| www.544542.com-彩派网-| www.716271.com-彩铅画简单初学者| www.785597.com-中国体彩网官方篮球| www.863554.com-彩票采集器修复教程| www.952154.com-七乐彩网址-| www.994839.com-姓名选彩票号码| www.zt64.com-篮球彩票怎么买| www.75ow.com-天佑竞彩是啥| www.490058.com-会员登陆百胜彩票| www.120326.com-体彩图谜第一版| www.yd83.com-湖南体彩论坛排列三| www.31th.com-彩红宝宝第一季| www.0513.net-正发彩票-| www.947108.com-快频彩应该怎么玩| www.692306.com-泰国的彩票哪里兑现| www.832479.com-七彩云app官网| www.928627.com-海南彩票快速玩法| www.985912.com-湖北时时彩开彩结果| www.mu52.com-宝盈彩苹果版app| www.357738.com-前夫中彩票-| www.540733.com-彩票作弊器真的假的| www.770399.com-好彩网红节推荐号码| www.894829.com-赢彩网计划平台| www.pc08.com-福彩排7走势图| www.84di.com-伦敦两分彩-| www.48812.com-中国竞彩258| www.542608.com-三分快三网站| www.908752.com-福利彩票玩法说明| 天地彩www.3tdc.com| www.365279.cc-云顶彩票官网| www.373814.com-辽宁福彩七乐彩| www.517529.com-七k官方彩票网站| www.086350.com-凤凰彩票可以玩吗| www.277442.com-七星彩19035期| www.353837.com-彩票榜是骗人的吗| www.34565.cc-福彩了d开奖结果| www.401009.com-703彩票合法吗| www.230062.com-快三北京一定牛| www.795285.com-彩开头的四字成语| www.883594.com-彩票梦想站改名了| www.74dc.com-北京3d黑彩多吗| www.55376.cc-时时彩代理犯法吗| www.382815.com-新浪胜足彩-| www.709859.com-谁有体彩店微信号| www.605554.com-彩票榜官方邀请码| www.726122.com-中乐彩为什么打不开| www.808481.com-全国各地方彩票开奖| www.877982.com-国彩快3-| www.7773.win-网上彩票的心得体会| www.46073.com-幸运测算时时彩宝典| www.559706.com-首页彩票-| www.085420.com-红包彩票-| www.ss44.cc-快乐时时彩走势图|