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天

知道了
1分快三 www.886723.com-中国福彩是骗局吗| www.45gl.com-三分彩计划一码| www.203897.com-七乐彩截止购买时间| www.578443.com-佛山体彩-| www.455451.com-七彩德宏麻将下载| www.6fx.cc-手机投够彩票| www.803133.com-彩圣网免费大全| www.962368.com-中国彩票网app| www.vi8.cc-新加坡南洋彩开奖记| www.81630.com-福彩快三多久开一次| www.055327.com-8彩下载-| www.217872.com-彩之王app-| www.325853.com-新浪竞彩比分| 500彩票www.904861.com| www.105992.com-彩票官方网站下载| www.459575.com-的的跟单体彩软件| www.589057.com-中彩票的税率是多少| www.731952.com-久久彩票爱彩彩票| www.973515.com-快三红号有多少个| www.32io.com-百废彩票开奖查询| www.481112.com-彩印和原件差别大吗| www.069900.com-河北快三全天计划| www.28gi.com-彩票88官网-| www.277600.com-乐彩赢主页-| www.467632.com-彩票开奘查旬| www.605233.com-彩色苹果笔记本| www.703156.com-湖南省福利彩票网| www.445334.com-网上怎么玩即开彩票| www.010334.com-博發彩票-| www.155752.com-微彩是违法的吗| www.3380.wang-66好彩合法吗| www.286539.com-网上彩票怎么拉代理| www.br59.com-内蒙体彩快三| www.476636.com-福少时时彩官网| www.603565.com-ag彩票平台官网| www.685601.com-购彩平台可靠吗| www.793852.com-党员买彩票的规定| www.w66.website福彩官方网首页| www.363007.com-福彩万能四码| www.499396.com-分分彩挂机安卓版| www.596186.com-福利彩票奖项设立| www.75753.cc-老猫看彩公众号| www.085098.com-星空彩票手机app| www.6035.shop-600万彩票下载| www.017602.com-秒速时时彩开奖盛世| www.77230.com-体彩站能买双色球吗| www.032747.com-淘彩网首页-| www.565349.com-福彩三d杀号定胆| www.703999.com-竞彩足球跟单广告语| www.203269.com-彩票坊app-| www.371994.com-体育彩票有骗局吗| www.505484.com-高频十分彩走势图| www.1414.in-万彩c8-| www.781640.com-福利彩票20期| www.902633.com-彩票博彩36o| www.974521.com-体彩大乐透的规律| www.cai9982.com苏州快三开奖查询| www.428722.com-种彩虹摇钱树| www.575433.com-时时彩票软件大全| www.682823.com-体彩3d综合走势图| www.792802.com-彩票中奖符有用吗| www.916889.com-福彩3d口诀个位| 全民彩票www.qm71.com| www.7336.vip-7号彩虹电池| www.27393.cc-足彩单场胜负彩| www.82430.com-新浪网彩票竞技| www.029680.com-东莞利彩-| www.101216.com-快三预测苹果软件| www.21299.com-甘肃开体彩店赚钱吗| www.690324.com-澳客网彩票论坛| www.850159.com-足彩容错玩法怎么买| www.966945.com-新彩票网首页| www.sv3.com-上海彩票店-| www.yh61.cc-甘肃快三和值跨度| www.93oc.com-英国五分彩票| www.7112.in-福彩双色球专家对比| www.45027.com-彩38网站官方网站| www.192230.com-福利彩票快三| www.305325.com-七星彩历史查询器| www.cv66.com-好彩票官网-| www.40568.cc-掌优彩票赚钱吗| www.94101.com-19048体彩-| www.001478.com-北京时时乐彩| www.92gf.com-87彩票店安全吗| www.513313.com-大星彩票网走势图| www.33979.com-上海体育彩票兑奖处| www.ji90.com-哪些彩票平台送彩金| www.413.cc-彩艮乐千禧3d| www.2233.hk-诺亚国际彩票| www.2112.space-福利彩票三等奖单注| www.0839.tv-足彩还能网上买吗| www.136592.com-淼鑫彩票网页| www.84jv.com-百乐门彩票官方平台| www.244856.com-快三倍投计划| www.331159.com-彩票看趋势-| www.400066.com-香港开码结果开奖彩| www.514086.com-美国彩票强力球9| www.603121.com-下载万众彩app| www.671963.com-彩票网站哪里做得好| www.743721.com-1216.彩票首页| www.812403.com-网易彩票网址是什么| www.884147.com-彩票三十六选七开奖| www.958645.com-四川省快三-| 凤凰彩票www.66652m.com| www.555983.com-快三平台如何建站| www.630792.com-好友游戏彩票app| www.695678.cc-豪彩一vip彩种| www.761504.com-陕西体彩中心在哪| www.847825.com-福彩几等奖说明| www.938639.com-亿彩彩票苹果app| www.ur80.com-彩神v是什么软件| www.112387.com-英雄联盟有彩票吗| www.592130.com-荣耀彩票网-| www.554613.com-体育彩票入门知识| www.60jl.com-728彩票旧版首页| www.52038.com-快三最高奖-| www.dw2.cc-重庆时时彩最新规定| www.c05.org-五分彩走势图app| www.1723.cn-开户送彩金博彩| www.814934.com-足彩19038分析| www.504114.com-重庆时时彩全天计划| www.603757.com-粉彩少女-| www.08255.com-湖南体彩支票| www.185327.com-北京快三和值规律| www.330785.com-彩票软件赚钱| www.408887.com-哪里可以购买七星彩| www.715396.com-新鑫鸿彩票骗局| www.527718.com-乐彩网能赚钱吗| www.128609.com-全球彩票骗局| www.412241.com-刮彩票中了100块| www.80xe.com-中国福利彩票试机号| www.219292.com-一分彩规律-| www.431321.com-竞彩足球魔方官网| www.654568.com-幸运十分彩开奖号码| www.852239.com-足球竞彩推荐网易| www.125049.com-彩票真能中奖| www.223338.com-足球彩票下载| www.332967.com-腾讯彩票分分彩| www.476317.com-网上彩票黑平台识别| www.590303.com-福彩三d谜语图| www.759832.com-祥云彩彩票合法吗| www.920412.com-彩票新闻网-| www.77255.com-买彩票好难中吗| www.478278.com-综艺福彩内测| www.545860.com-国安彩票在哪里买| www.755058.com-深圳南油福利彩票| www.136084.com-我买彩票不中奖呢| www.454245.com-乐彩会员心水资料| www.576925.com-买彩票要选几个号码| www.677730.com-下载一个南方双彩网| www.752320.com-时时中彩票电脑版| www.907769.com-合肥体彩几点上班| www.ja17.com-福彩3d规则-| www.2zm.cc-七乐彩中奖奖金领取| www.415.net-网上买彩票输了想死| www.hj27.com-体育彩票app| www.380042.com-七乐彩如何看中奖| www.519982.com-陌陌上的彩票骗| www.13146.com-中彩网双色球行列图| www.579662.com-彩13官网下载| www.639911.com-中国最大的彩票网站| www.709005.com-必赢彩注册-| www.771505.com-美团有彩票吗| www.894675.com-投资彩票怎么赚钱|