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.171360.com-体彩开奖是多少| www.335934.com-体育彩票大乐透买法| www.439570.com-梦见中奖彩票丢了| www.531903.com-九宫休彩票图片| www.706335.com-三分时时彩公式| www.790636.com-福彩32期中奖号码| www.870427.com-秒速时时彩开奖网站| 天天彩票www.54968f.com| www.ld73.com-中彩彩票下载网址| www.n49.club-用户注册中福彩票| www.55ly.com-中国移动彩票| www.0187.la-彩票16下载-| www.9106.shop-七乐彩今晚开奖金额| www.50072.cc-彩票老司机软件下载| www.97785.cc-彩光嫩肤仪-| www.066212.com-彩票搭建演示| www.136624.com-快2彩票计算公式| www.231832.com-湖北快三统计图一网| www.311822.com-发彩快三人工计划| www.385309.com-彩票大平台抢红包| www.567551.com-天津市福彩中心电话| www.645099.com-青岛彩票兑奖中心| www.749004.com-600w彩票网平台| www.822527.com-有没有买彩票的软件| www.894927.com-悠悠双色球购彩| www.964757.com-一分时时彩开奖号码| 汇彩网www.www.hcw266.com| www.jg47.com-爱彩乐助手-| www.c27.vip-北京福彩一等奖| www.35qr.com-单县体彩在哪里买| www.1164.com-彩票怎么跟长龙计划| www.7882.top-立中国福彩-| www.26776.com-贵卅快三一定牛首页| www.70883.com-腾讯三分彩下载| www.053583.com-yy彩票官方注册| www.135474.com-彩赢天下721cc| www.212323.com-彩票挂机真的稳赚吗| www.288622.com-彩票长龙躲避| www.393912.com-日彩网官方下载| www.517153.com-乐艺彩票关闭了| www.586748.com-昨天彩票出的什么号| www.671257.com-彩乐园ll下载安装| www.751310.com-网上不能买彩票了| www.814782.com-c868彩票登-| www.879746.com-彩票系统-| www.997439.com-下载中国彩票软件| www.la2.cc-苏州快三今天开奖| www.pk93.cc-河南省福利彩票| www.85.biz-中国彩吧下载桌面| www.67vf.com-什么是彩色沥青| www.0736.in-彩票托是怎么回事| www.8611.date-彩神通怎么样下载| www.39611.com-中彩在线提现提不出| www.84442.cc-彩钢瓦料-| www.034437.com-博彩源码修复教程| www.132844.com-宝马彩票平台官网| www.209888.com-星光彩票大发快3| www.279872.com-福彩三地天气网| www.382138.com-创名彩票下载| www.502680.com-678彩票网最新版| www.572060.com-广西快乐双彩开| www.644916.com-35彩票网开奖导航| www.747663.com-购彩官方网站| www.813656.com-体彩刮刮乐送金条| www.882142.com-韩国彩票-| www.965498.com-百盈时时彩计划全天| 500彩票www.50026e.com| www.ew68.com-体彩体彩开奖| www.vc96.com-南京福彩3d大奖| www.06il.com-彩铅配色技巧| www.70sc.com-购物送彩票广告语| www.0921.vip-合买彩票中了人跑了| www.9885.top-财政部互联网彩票| www.51231.cc-快三投注倍率表| www.92112.cc-手机顺风彩票| www.046855.com-盈彩网怎么样| www.196920.com-福利彩票开奖结果i| www.263998.com-福彩贴吧-| www.355897.com-彩票拍照查询软件| www.432324.com-重庆时彩彩平刷技巧| www.521817.com-喝彩中华2018| www.585531.com-天然彩宝饰品| www.654882.com-彩票几点买容易中奖| www.776242.com-火箭彩票安卓app| www.861134.com-五百彩票直播新浪| www.919522.com-彩票5首页-| www.973789.com-腾讯分分彩平台推荐| www.fy01.com-刷彩票流水-| www.wz08.com-休彩排烈三和值表| www.11gf.com-新彩陶瓷-| www.74rd.com-福彩主任死刑| www.1005.cm-南昌彩票店转让信息| www.9771.xyz-时时采彩软件计划| www.47493.com-江苏好彩60123| www.88951.cc-彩票资料app下载| www.036011.com-福彩刮刮奖广告语| www.130992.com-彩礼超两万是违法| www.200068.cc-我要看彩票开奖结果| www.266504.cc-即时開彩-| www.365302.cc-12彩票安卓版| www.445653.com-吉林彩票中奖| www.530128.com-二八彩票怎么看| www.624140.com-33彩票安全不| www.687113.com-网购大乐透彩票| www.762319.com-博王时时彩计划软件| www.862690.com-泰安彩票中奖| www.918985.com-手机正版福利彩票| www.971949.com-众创彩票骗局| www.cp6000.cc-中国体育彩票竞彩网| www.ld92.com-下载中彩彩票苹果| www.zw55.com-博彩-| www.19db.com-星期五开什么奖福彩| www.521.cx-福利彩票石家庄地址| www.3656.wang-快三正文-| www.8698.site-彩票开奖百度| www.48665.com-博时时彩-| www.87247.com-超级彩票代打| www.029146.com-最有收藏价值的彩票| www.097195.com-福彩3d今天小鱼图| www.151710.com-福利彩票多少个数字| www.269233.com-彩票99是官方网站| www.347686.com-添光溢彩的意思| www.412898.com-彩色水泥瓦-| www.505278.com-博友彩首页是不是被| www.566848.com-彩虹六号进游戏崩溃| www.625587.com-珠江彩票app下载| www.681999.com-五分彩分析-| www.749477.com-中彩彩票怎么充值| www.805676.com-二八彩app-| www.872824.com-遵义彩票中奖双色球| 幸运彩www.09xyc.com| www.am29.cc-盛大彩票平台可靠吗| www.ph37.com-苏州e球彩-| www.7xm.cc-中国足彩网即时比分| www.53eg.com-新粤彩开奖最新结果| www.526.tv-时时彩龙虎和怎么出| www.3252.biz-重庆分分彩平台登录| www.8206.top-玖亿彩票下载| www.22867.cc-潮信买彩票安全吗| www.58465.com-五洲彩票下载安装| www.109298.com-破解数字彩票| www.165061.com-彩票012-| www.245518.com-胜负彩比分直播| www.306432.com-688彩票网app| www.363350.com-重彩画-| www.430124.com-利彩提现-| www.511231.com-彩库宝曲手机版| www.568705.com-微彩是真的假的| www.627598.com-新乐彩平台下载安装| www.682703.com-国家授权彩票app| www.746888.cc-大赢家购彩平台骗局| www.804866.com-彩虹??符号-| www.875416.com-河南福彩幸运彩走势| 中彩网www.91233t.com| www.bb96.com-爱彩通-| www.ob38.cc-易彩2.0软件下载| www.y57.cc-体彩排列3字谜论坛| www.41fk.com-七星乐彩票正规吗| www.97si.com-博友彩报警管用不| www.2016.cc-彩虹6号刘醒配置| www.6578.org-聚鑫乐彩票-| www.05901.com-福彩三地和值规律| www.39535.com-天天中彩不能提现| www.74776.cc-七色彩开奖结果规则|