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天

知道了
彩票123现在叫什么名字 www.527229.com-玩北京快三怎么才赢| www.220309.com-下载乐彩网app| www.611828.com-9b彩票会员充值| www.556105.com-体育博彩软件| www.191886.com-大乐透彩经网| www.590873.com-49彩票开奖结果| www.669982.com-彩色童话故事| www.768808.com-粤淘彩票购票厅| www.ab59.com-快三买豹子技巧| www.188255.cc-两个平台对打套彩金| www.274781.com-老彩民软件-| www.362721.com-中国彩票真假如何| www.971786.com-盈彩彩彩票是真是假| www.jh11.com-电子彩票怎么兑奖| www.0cj.com-天天彩票漏洞| www.588111.cc-足球竞彩彩票安卓版| www.180075.com-湖北福彩快三一定牛| www.74360.com-彩票121首页| www.526762.com-时时彩投资盈利计划| www.619592.com-彩票和邓家-| www.69711.cc-彩票代码下载| www.779992.cc-福彩三d计算方法| www.44741.com-福建体彩兑奖在哪里| www.070049.com-云来娱乐彩票| www.975307.com-老彩民快3-| www.707399.com-足球彩票预测推荐| www.092276.com-福建体彩投注| www.854452.com-大发快三骰子下载| www.675215.com-众彩网排列三专家| www.788454.com-竞彩唯彩看球| www.953206.com-福彩3d中奖助手| www.wr12.com-苏宁易购彩票| 中彩网www.71233g.com| www.7167.cm-七彩的假期作文| www.646954.com-日本联赛足彩秘籍| www.782515.com-彩51官网是真的吗| www.887320.com-天天购彩网是真是假| www.978038.com-富彩彩票是骗局吗| www.fv42.com-投资福彩快三| www.b35.cm-江苏快三官方| www.281525.com-内蒙古快开时时彩| www.369507.com-彩票源码出售妙招| www.021749.com-竞彩嘉奖app| www.089553.com-众彩网火烈鸟大乐透| www.ta85.com-彩种厅-| www.183510.com-上海的快三走势图| www.650611.com-彩虹伞小班体育活动| www.307817.com-七星彩17154期| www.200451.com-河南快三大小走势图| www.524908.com-彩票各两大平台互刷| www.266280.com-足彩19038任九| www.7mw.cc-free彩票-| www.cai4377.com快三走势图如何看| www.nk30.com-14场胜负彩对阵表| www.885186.com-神州行彩票网站| www.970834.com-高频彩票漏洞赚钱| www.cp611.com-彩神大发app| www.zh74.com-彩票500官方端口| www.45rf.com-彩票精算出来| www.343590.com-彩票软件挣钱的方法| www.449814.com-沈阳市福彩中心电话| www.533937.com-七星彩怎么计算合分| www.602462.com-彩38彩票app| www.684163.com-天天有好彩正版资料| www.770879.com-买彩票彩票选号码| www.888116.com-篮球彩票网-| www.962978.com-中国体彩票-| www.gd88.com-福彩十选五网络骗局| www.234645.com-福彩3d专业版下载| www.306098.com-香港官方网彩票| www.370268.com-ee彩-| www.455515.com-国乐彩在哪下载| www.538688.com-彩票背后的阴谋| www.602758.com-彩虹六号不过审| www.670490.com-胜彩国际-| www.678748.com-彩金国际娱乐| www.016606.com-福彩胆拖投注计算| www.603144.com-彩虹六号台词| www.6238.in-福彩快乐10分攻略| www.38sh.com-中国福利彩票开门彩| www.958275.com-七星彩所有数据| www.31fi.com-万国彩宝是什么品牌| www.548706.com-福彩门户新地址| www.916908.com-永盛彩票网下载| www.4954.biz-网彩属于投资| www.949421.com-北单足彩群-| www.700277.com-辽宁省体育彩票中心| www.812802.com-体彩排列三跨度| www.910677.com-广西快三计划公式| www.996727.com-黑龙江省体彩官网| www.pf68.com-快三跟豹子计划| www.22sp.com-166福利彩票| www.606028.com-明天福利彩票| www.3686.com-川沙彩色复印机租赁| www.635670.com-七彩阳光第三套伴奏| www.781058.com-宝岛彩票开奖| www.878357.cc-体彩排列三怎么玩法| www.949961.com-百宝彩一湖北快三| 彩69www.899485.com| www.8ed.com-七星彩铁卒精准| www.85au.com-炫彩之剑坐标| www.2216.cm-智博网彩票预测| www.518500.com-神圣彩票官网| www.858254.com-买体彩输钱-| www.982423.com-蜂巢时时彩计划网页| www.cp6667.cc-中国福利彩票软件| www.zv75.com-c8万彩吧-| www.50ww.com-德国鲸彩漆-| www.977316.com-18137期足彩| www.104769.com-昆明牛牛彩票| www.4276.vip-彩票优化软件下载| www.8226.org-国家彩票改革| www.729339.com-500彩票幸运28| www.255520.com-福彩12选5开奖号| www.383959.com-福利彩票资格考试| www.326022.com-彩经网排三胆码| www.801083.com-世界杯体彩赔率| www.905663.com-一分快三大小玩法| www.968722.com-怎么加时时彩群| www.ae68.cc-体彩排3-| www.981246.com-彩霸王三星做号软件| www.es26.com-手机中彩网客户端| www.529153.com-八卦推算彩票3d| www.599796.com-体彩大乐透三等奖| www.332665.com-福彩排列5计划软件| www.94131.com-体彩对社会的贡献| www.062273.com-大乐透彩神通软件| www.19bw.com-彩票厉史开奖查询| www.83ue.com-信彩计划网-| www.810605.com-cp彩票36·cm| www.297622.com-彩票攻略技巧知识书| www.439263.com-cclcc金彩网| www.3561.biz-手机验证送彩金38| www.32778.com-百万彩票app下载| www.731173.com-唯彩看球旧版| www.221660.com-瑞彩祥云邀请码分享| www.378562.com-彩票输了100万| www.464638.com-时时彩的倍数是多少| www.537760.com-彩色面团-| www.8809.shop-幸运分分彩开奖号| www.87268.cc-1分赛车彩票怎么玩| www.097536.com-彩票5选3中奖规则| www.229252.com-手机彩票一分钟一开| www.365505.cc-即时开彩2014| www.476668.cc-财富计划彩票| www.555557.cc-吉林快三属于赌博么| www.667445.com-新加坡赛车彩票| www.1168.tv-体彩基础知识教程| www.875196.com-彩票亿元大奖故事| www.950356.com-cp533彩票网站| www.cai1144.com快三是不是骗局揭秘| www.233831.com-河北河北快三走势图| www.088812.com-举报长春黑彩六处| www.584623.com-彩金可以换黄金吗| www.8988.tv-新时代彩票网址| www.08366.com-体彩胆拖投注| www.112664.com-61233中彩网| www.254626.com-重庆时时彩停售原因| www.899984.com-天天彩票怎么下载| www.kb83.com-彩票比分直播| www.769.red-赢彩王软件可靠吗| www.358744.com-新天成彩票网靠谱吗| www.472062.com-三色彩开奖结果| www.545591.com-福利彩票站那里申请|