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.4888.live-668彩票怎么样| www.087917.com-彩运网平台下载安装| www.984862.com-3d彩票做号专家| www.740014.com-品彩-| www.922763.com-彩票店能过户吗| www.gs1.com-优彩社区网站首页| www.038248.com-财神爷彩票网址下载| www.184718.com-彩神大发快三手机版| www.871603.com-中彩娱乐下载手机版| www.ui10.com-福彩3d之家预测网| www.927.red-临沂孙大夫彩票绝技| www.799499.com-时时彩彩票aqq| www.806281.com-彩民村高手资料| www.229383.com-快2彩票技巧| www.29556.cc-175000乐彩网| www.582514.com-高频彩二十分钟一期| www.667841.com-福利彩票小说| www.746109.com-天天手游彩票计划| www.822218.com-湖北快三走试图| www.1688.site-福彩3d布衣2| www.57568.com-福彩双色球复式预测| www.7141.vip-相信时时彩能赚钱| www.3311.tv-福利彩票图片美图| www.884741.com-亿彩堂下载-| www.971467.com-福彩手机报-| www.s13.biz-中彩网与500| www.74mm.com-金海特彩票网3d| www.750010.com-全中彩票最-| www.627591.com-百盈快三犯法吗| www.588342.com-体彩七星彩怎么开奖| www.xq39.com-oe彩票投注平台| www.108476.com-新彩网手机板| www.320677.com-百宝彩票河南泳坛| www.3050.bid-金祥彩票网官方网站| www.60893.com-新星彩下载-| www.3684.cc-大众彩体彩走势图| www.567357.com-南京彩票大奖| www.697422.com-乐彩app官网下载| www.978945.com-贵烟好彩香烟价格| www.aj07.com-查询福利彩票双色球| www.49vo.com-三地新彩网-| www.85087.com-彩乐乐双色球选号器| www.71qh.com-福彩结束时间| www.wi21.com-七星彩小说-| www.31mu.com-福利彩票赔率怎么算| www.2877.in-内蒙古快三的口诀表| www.2040.in-k8彩票坑人吗| www.542828.com-绍兴玲珑湾彩票| www.yy71.com-红旗彩票网官方网站| www.250378.com-中彩彩票快3| www.kb46.com-网上彩票网址有哪些| www.cp425.com-凤凰私彩彩票官网| www.cp7769.com-苹果手机买彩票| 金冠彩票www.49956q.com| www.190606.com-河北快三豹子| www.098813.com-湖北快三势图分布图| www.209344.com-黑彩怎么干-| www.301045.com-糖果派对彩金视频| www.388266.com-0567彩票app| www.519283.com-重生之彩票富翁| www.960086.com-五亿彩下载-| www.es3.com-重庆时时彩网址| www.sr00.com-很多体彩店没有竞彩| www.297.cc-网上有人带玩七星彩| www.6245.xyz-五福彩票安卓| www.980013.com-刺客研彩网3d论坛| www.cp7769.com-苹果手机买彩票| www.443755.com-手机掌上百胜彩票| www.673756.com-古建筑天花彩绘| www.824544.com-彩票坐庄-| www.86687.com-广州鸣彩传媒正规吗| www.087806.com-幸运快三谁被骗过| www.662105.com-新世界彩票计划软件| www.778306.com-彩乐园ⅱ网址| www.871061.com-陕西快三官网开奖| www.954724.com-体彩怎么玩世界杯| www.pa33.cc-快三复式票玩法| www.365116.cc-风之彩app彩票| www.461677.com-福彩3地开奖直播| www.9361.loan-乐城彩票邀请码| www.019174.com-牛彩票网址-| www.p12.xyz-彩票买了20年| www.386180.com-乐彩客下载苹果| www.69088.com-澳客竞彩足球电脑版| www.5135.live-彩托怎么当-| www.53739.com-澳洲5星时时彩| www.078365.com-福利彩票那个安全| www.397533.com-飞来福彩吧微信加入| www.661065.com-全国地方彩种| www.787154.com-天天时时彩论坛网址| www.892107.com-竞彩2串1大奖| www.989417.com-彩83彩票网注册| www.dh65.com-中福彩票五分彩骗局| www.131510.com-新乡彩礼2018| www.217692.com-五星彩票是骗局揭秘| www.370137.com-四季彩注册登录| www.1688.bid-浙江体彩6-| www.489558.com-福彩3d中天图库网| www.32019.com-七天彩官网-| www.cv69.com-湖北省快三开奖号| www.90dq.com-电竞博彩推广| www.3406.vip-彩报王663299| www.00745.cc-中国体彩营业时间| www.48696.com-博王时时彩计划软件| www.001706.com-好彩网网址-| www.571961.com-彩83苹果下载软件| www.016411.com-彩票k线趋势软件吧| www.090971.com-众彩网生活app| www.174322.com-快三平台靠谱吗| www.949314.com-五福彩票网上| 大赢家彩票平台www.810877.com| www.ib84.com-安徽福彩中心官网| www.11gy.com-天彩粮集团骗局| www.461946.com-彩票彩宝网-| www.541366.com-多金彩84384| www.85884.com-江苏彩铝卷-| www.06527.com-500竞彩比分| www.61285.cc-购彩v是什么东西| www.98682.cc-足彩8串9中奖规则| www.744484.com-彩虫官方下载| www.578828.com-一定牛吉林快三走势| www.98815.cc-澳客七星彩杀号定胆| www.118096.com-体育彩票和尾值| www.787475.com-神马彩票下载安装| www.899665.com-幸运彩开奖-| www.978857.com-好彩在哪买-| www.ac32.com-正版马会开彩结果| www.322571.com-海南七星彩直播网站| www.a66.net-北京彩票快三| www.772523.com-依彩化妆品怎么样| www.975459.com-彩票购买推荐| www.192357.com-甘肃体彩-| www.282917.com-中国福彩积分网| www.375392.com-玩彩票老是输钱| www.no17.com-竞彩计算器500| www.08vs.com-周易如何选彩票号码| www.54gn.com-菜宝彩票-| www.881642.com-彩票走势图新浪网| www.019275.com-美国彩票多少钱一注| www.350255.com-玩网络彩票赌博输惨| www.445953.com-易彩可以提现吗| www.522259.com-七乐彩输入号码查询| www.4970.vip-中澳彩票平台| www.895600.com-玛雅彩票高频彩| www.01of.com-鼎隆彩票网-| www.118643.com-11选5辽宁体彩| www.645561.com-女人梦见买彩票中奖| www.654206.com-速8彩票真假问题| www.812384.com-178彩票客户端| www.695061.com-中国福利彩开奖时间| www.773304.com-99彩票平台app| www.5169.pw-七乐彩走势图五行| www.73448.com-牛彩藏图正版藏机图| www.798088.com-会员登陆彩票| www.116583.com-彩票网168-| www.473632.com-彩票排列三怎么玩| www.573622.com-彩票反水4%的平台| www.640039.com-高压吉林快三走势图| www.701899.com-体彩福建-| www.779858.com-彩易双色球综合舨| www.863283.com-足彩19049分析| www.927105.com-体彩48l走势图| www.990215.com-彩乐园彩票-| www.dw45.com-吉林快三代理|