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天

知道了
百盈PK10 www.474172.com-腾讯分分彩倍投方案| www.dq6.cc-500彩票彩种| www.yt61.com-3d彩票个人技巧| www.66so.com-七乐彩奖金分配图| www.1222.me-全民汇彩票百度贴吧| www.54415.com-彩金-| www.2602.pw-湖南福彩论坛萧彩| www.76818.cc-竞彩足球官方微信| www.21208.com-神彩争霸2-| www.518614.com-乐彩网手机论坛下载| www.29ok.com-中国体彩直播网| www.76858.cc-安微快三夸度走势图| www.2634.cm-香港百彩网免费料k| www.79wm.com-cb彩票-| www.245637.com-搜索中国竞彩网| www.879485.com-彩票亭里是干嘛的| 大赢家彩票www.354911.com| www.764277.com-体彩p5-| www.865019.com-华彩在线网站| www.947851.com-免费彩票预测软件| www.cai9200.com河北省福利彩票快三| www.93841.com-网易彩票注册| www.073501.com-财神彩票-| www.139147.com-彩之星app下载| www.229826.com-鸿彩网app下载| www.84704.com-时时彩两期必中计划| www.388621.com-迷彩图案手绘画法| www.354.tv-七星彩现场开奖码| www.444248.com-足彩主队-| www.779851.com-中彩易软件哪里下载| www.713193.com-3d博彩吧-| www.795125.com-手机上的快彩合法吗| www.868331.com-湖北快三分析| www.303538.com-好彩3复式计算器| www.371732.com-天下彩赚钱真的吗| www.787085.com-今晚七星彩开码结果| www.66395.cc-京东金融彩票入口| www.sp18.com-我福利彩票3d查询| www.989291.com-快3福彩代理| www.gs50.com-三分快三计划平台| www.871619.com-手机彩票缩水| www.956527.com-快三如何看走势图| 500彩票www.508477.com| www.ly16.com-甘肃快三技巧有哪些| www.965470.com-亚博彩票是合法的吗| www.cai2833.com快三专家预测| www.lo38.com-下载重庆福彩手机报| www.j71.me-深圳福彩开奖结果| www.428255.com-金手指足彩缩水公式| www.633846.com-七彩时尚宾馆| www.765481.com-奥克彩票网-| www.958687.com-彩票87官方端口| www.cp062.com-江西多乐彩老走势图| www.04yc.com-福彩36期开奖结果| www.781663.com-体彩大乐透开奖结杲| www.092715.com-福建体彩兑奖| www.716983.com-彩铅画的画怎么画| www.818767.com-冮苏快3彩-| www.906069.com-中国竞彩比分直播| www.982020.com-买彩票快十分钟技巧| www.ey96.com-安徽快三形态走势牛| www.707008.com-被骗去买彩票| www.288499.com-熊猫竞彩是骗局| www.654584.com-排列五体彩福彩| www.729583.com-神彩通是真的吗| www.813396.com-浙江福彩开奖号码| www.885993.com-彩之家首页-| www.947511.com-体育足彩app| www.995457.com-新浪彩票直播| www.qv2.com-快三稳赚不赔的技巧| www.505406.com-高频率彩票有哪些| www.21869.cc-彩钱三条什么意思| www.da41.com-彩神xapp-| www.8158.in-澳彩是什么意思| www.28792.cc-彩快上娱乐网址| www.88833.cc-大师双色球qq彩票| www.845616.com-3月17日竞彩预测| www.983370.com-天音,福彩,基诺| www.dx90.com-福建体彩网彩民论坛| www.12kc.com-福彩3d预测退存| www.798.cx-七乐彩推荐专家预则| www.841122.com-足彩分析预测500| www.948963.com-购彩网app正规吗| 全民汇彩票www.52303f.com| www.380469.com-西安苏宁智慧彩票店| www.561603.com-中一等奖彩票图片| www.k18.net-奥客网竟彩比分直播| www.208922.com-快彩网app下载| www.269520.com-福彩3d造假吗| www.366147.com-儿童彩铅画人物简单| www.066113.com-彩虹图片简笔画| www.717774.com-彩铅自然风景画教程| www.2607.wang-彩生活e师傅app| www.su46.com-下载福彩3d-| www.344598.com-彩票投诉平台| www.604487.com-倍率高彩票平台| www.04ub.com-吉林快三心得| www.476.win-航天彩虹镇如何| www.636267.com-庆典彩虹机哪家好| www.51510.cc-鸿彩快三彩票技巧| www.002379.com-福彩七星彩玩法介绍| www.168078.com-中国福彩快三| www.707611.com-时时彩官网开奖| www.5171.cc-彩票追期是啥意思| www.33118.com-彩票双色中奖查询| www.004084.com-深圳福彩快乐彩公益| www.61229.com-众彩网七星彩| www.48468.com-竞彩推单app| www.022146.com-安徽快三计划群| www.351481.com-彩客彩票滚球| www.420481.com-招聘彩票销售员| www.526860.com-帮人玩彩票赚佣金| www.587973.com-a3彩色复印打印机| www.460905.com-买彩票买那种好| www.810824.com-彩尊国际手机版下载| www.892839.com-彩500手机版本| www.976846.com-2018德州彩礼钱| www.262775.com-快三十大口诀| www.717551.com-彩铅画睡莲-| www.225284.com-五分的快三玩法介绍| www.974169.com-广东福利彩票的种类| www.ao.com-内蒙快三走试图| www.oi76.com-体彩19023期| www.602576.com-中彩票一等奖| www.568071.com-体彩加盟费与利润| www.624163.com-快三长龙预报软件| www.677727.com-双色彩票开奖查询| www.087288.com-彩福大厦地址| www.128419.com-利盈彩票999| www.254512.com-十一选五上海爱乐彩| www.rt03.com-手机中福彩票安全吗| www.665.in-怎么查看福彩| www.409005.com-天吉网3d电子彩报| www.566149.com-3d新浪爱彩走势图| www.661095.com-彩票服务-| www.735057.com-新快三手游单机游戏| www.802860.com-c58彩票网-| www.866782.com-全天彩是合法的吗| www.917359.com-新彩彩票靠谱吗| www.965614.com-竞彩推荐预测专家| 8816彩票www.8816x.com| www.355786.com-美国彩票交税详解| www.5968.bid-体彩11选5安徽| www.693252.com-辽宁福彩正规官网| www.3902.org-新盈彩彩票-| www.67bl.com-幸运分分彩免费计划| www.1220.vip-体彩福彩黑幕曝光了| www.431143.com-现在什么彩票开奖快| www.876455.com-去哪买世界杯彩票| 博汇www.818827.com| www.293111.cc-3d彩吧图库丹东| www.448330.com-3d分分彩-| www.572515.com-彩形声字-| www.3260.biz-倒霉时怎么买彩票| www.47680.cc-好彩妹结局-| www.068283.com-开发定制彩票平台| www.256713.com-安徽快三预则一定牛| www.903443.com-彩票3d双福-| www.gt0.cc-体彩481近30期| www.3471.vip-爱彩乐天津11选5| www.qu66.com-彩票真假中央调查| www.vx8.com-今晚七星彩开什么| www.026684.com-辉煌彩票咋样| www.557013.com-海南举报私彩|