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.737312.com-辽宁快三彩票怎么玩| www.717209.com-彩铅画优势-| www.03010.com-重庆时时彩作弊吗| www.318372.com-全国统一开奖3分彩| www.951626.com-红彩直播app| www.cai1911.com快三过五是什么意思| www.317576.com-竞彩看什么指数稳赢| www.818074.com-陆慧明足彩任九| www.83651.com-网上直播刮彩票| www.103347.com-福彩网官方网站| www.919909.com-go彩网-| www.99ac.com-体育彩票一周开几次| www.7408.pw-色彩静物临摹| www.862316.com-河南福彩大厦| www.680773.com-网站彩票提现照片| www.ak28.com-快彩11选5助手| www.360260.com-苹果原彩显示费电吗| www.494442.com-急兑彩票站出兑沈阳| www.584438.cc-彩票娱乐平台快三| www.664830.com-福彩神牛首页| www.738888.cc-江苏快三诚信群| www.813677.com-彩票抽奖-| www.890456.com-彩44平台-| www.959729.com-发彩网网站官网| www.pf61.com-网上快三算赌博吗| www.139762.com-时时彩万位必中规律| www.6532.cm-天天爱彩票客服电话| www.964385.com-体彩app大全| www.cp5991.com-广东快乐彩开奖结果| www.005669.com-微微彩票合法吗| www.293303.com-49彩票免费大全| www.231930.com-彩票77平台合法吗| www.60430.com-凤凰彩票能提现吗| www.79td.com-中了彩票的那些人| www.736668.com-上海体彩中心在哪里| www.866855.com-快三福彩书籍| www.ks12.com-福彩了d开奖| www.539814.com-福彩3d跨如何算| www.070001.com-福彩票中奖号码| www.5871.com-贵阳彩票冒领| www.603203.com-中彩走势图-| www.699626.com-竞彩高人-| 500彩票www.50024w.com| www.752.tv-好彩高手资料大全| www.216942.com-118彩票骗局| www.402300.com-dd彩票是怎么回事| www.786169.com-福彩网可以赚钱吗| www.016359.com-彩神4213777| www.dw61.com-乐福彩票官方网| www.j49.shop-河南省快三开奖号| www.131.xyz-夸女孩子彩虹屁语录| www.664892.com-生肖彩开奖必中六| www.947301.com-快三口决-| www.cp3309.com-三分快三下载| www.194273.com-网上玩快三骗局| www.759309.com-亿彩40066注册| www.623783.com-彩票提醒软件下载| www.501428.com-体彩十一选5走势| www.620157.com-釉上彩过程-| www.169234.com-安徽快三遗漏| www.135959.com-体彩篮球竞猜玩法| www.198370.com-彩吧图库第一版| www.7234.loan-彩虹六号机票价格| www.b90.cc-五分时时彩计划下载| www.71hb.com-vr金星彩票-| www.xt00.com-竞彩推荐平台| www.996852.com-网易福彩双色球机选| www.4738.biz-彩票可以折叠| www.48il.com-用移动积分兑换彩票| www.848058.com-古建彩绘厂家| www.858694.com-快三14和值-| www.9683.cn-六会彩资料查看| www.984268.com-二分彩有什么技巧| www.283233.com-彩票双色球玩法规则| www.255913.com-河北省体彩兑奖地址| www.4743.cc-做火车买彩票中奖| www.232583.com-玩彩票算赌博吗| www.235495.com-310足彩走势图| www.311104.com-极速3分彩官网| www.735375.com-37彩票网址-| www.811730.com-双彩网计划-| www.902966.com-时时采彩全天计划| www.992744.com-江苏快三可以玩吗| www.dr84.com-福彩快三怎么下载| www.757859.com-玩彩票如何才能赚钱| www.368159.com-七彩星百度云txt| www.248593.com-福彩有几个号码| www.it51.cc-胜负彩直播比分| www.695325.com-竞彩支持比例与误差| www.89mk.com-下载足球竞彩彩票| www.3934.biz-东北结婚彩礼多少| www.0307.loan-2月彩票销量| www.7792.cm-珐琅彩和粉彩的区别| www.201349.com-乐佳商城彩票端| www.45943.com-11选5官方彩票网| www.848693.com-汪汪时时彩升级版| www.937477.com-快三包号技巧| 博亿彩票www.626by.com| www.eo82.com-彩票开奖双色球走势| www.927832.com-国外有高频彩票吗| www.019243.com-福利彩票多少钱一张| www.114731.com-山东齐鲁彩票双色球| www.hx16.com-湖北快三最大遗漏值| www.39503.com-七星彩好的号码推荐| www.99873.cc-168彩票-| www.062230.com-刘雪龙黑彩视频新闻| www.820.tv-彩虹糖的梦-| www.5498.cn-网上开彩票投注站| www.596533.com-福彩3d是多倍数| www.345412.com-福彩中奖号码今天| www.197765.com-吉林今日快三开奖号| www.279626.com-广东福彩手机客户端| www.849647.com-竟彩比分直播5oo| www.929087.com-七星彩中多少号有钱| www.985411.com-足彩反着买-| www.sl22.com-重庆彩票中心| www.2uw.com-时时彩真的会上瘾吗| www.45jl.com-吉林市黑彩群| www.83en.com-香港精准彩霸王开奖| www.772942.com-k线彩票软件| www.4425.vip-河北福彩排列走势图| www.924792.com-世界彩票中奖最多人| www.55564.cc-英国五星彩-| www.hf04.com-一网彩票预测| www.293086.com-智慧彩软件-| www.10828.com-567时时彩-| www.10347.com-爱彩乐陕西十一选五| www.262266.com-快三统计-| www.717561.com-用彩铅画的兰花| www.5683.cm-乐天彩票网是真的吗| www.671925.com-亚博竞彩官网| www.025865.com-代刷彩票-| www.635092.com-顾乡凯德七彩影城| www.086962.com-近期七乐彩中奖情况| www.228246.com-分分快三投注技巧| www.324097.com-乐彩网是不是骗局| www.405287.com-幸福彩频道节目表| www.528571.com-凤凰微彩店-| www.540122.com-网易彩票一分快三| www.701417.com-淘宝彩票怎么买| www.qe09.com-新浪彩票开奖视频| www.044545.com-大信快三彩票| www.462815.com-福彩3d预测天吉网| www.34187.com-保定彩票机怎么申领| www.487680.com-好彩网1184-| www.739553.com-下载人人中彩票安装| www.fe3.com-北京快乐彩开奖结果| www.tv34.com-彩票千万别合买| www.91294.com-欧免好彩蓝莓双爆| www.066372.com-彩票私彩-| www.733375.com-3d彩宝专业版| www.806069.com-风云彩票a-| www.872639.com-贵阳福彩怎么申请| www.cai900.cc-一分快三是什么意思| www.037374.com-后三豹子时时彩| www.456029.com-彩票输了十万| www.552688.com-华彩大发快三| www.611397.com-福彩游戏诈骗| www.664687.com-k3k3的网址彩票| www.718325.com-安徽快三期开奖| www.777688.com-乐艺彩票真的假的| www.830898.com-上海的彩票-| www.891695.com-有微信彩票合买群吗| www.947958.com-中福彩国际文化|