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.nc97.com-彩51官网-| www.425630.com-彩票倍率高的台子| PK彩票www.183699.com| www.nv56.com-福彩3d五行八卦图| www.04486.com-微信提现的彩票网站| www.87893.cc-3分彩是合法的吗| www.095060.com-手机购彩平台3d| www.783542.com-什么是会员彩票| www.884558.com-三彩彩票官网| www.984935.com-彩运8彩票-| www.pn9.com-韩国快三可靠吗| www.pg00.com-兰州体彩中心地址| www.7cb.cc-和彩官网-| www.764789.com-最好用的彩票app| www.hk15.com-吉林快三出的什么号| www.021.pink-大乐透预测走彩吧| www.9795.loan-七星彩兑奖时间| www.828294.com-春天彩票能提现吗| www.bg13.com-大发快三走势怎么看| www.1121.cc-足彩竞彩中奖新闻| www.479813.com-河北永定快三查询| www.589528.com-七星彩大狼狗图纸| www.679296.com-老公买彩票-| www.771384.com-澳门五分彩官方首页| www.852232.com-百彩网免费料一| www.918008.com-免费攻击私彩的软件| www.984284.com-福利彩票怎么玩儿| www.nk2.com-彩7app下载-| www.363881.com-沈河区福利彩票| www.500029.cc-彩票最早形式| www.578813.com-彩票店室内布置| www.665631.com-胜负彩十四场投注| www.736882.com-上海福彩中心在哪| www.820137.com-合水为彩礼杀人| www.891579.com-彩票统计数据| www.963243.com-彩铅怎么调色| 爱购彩票www.073552.com| www.gi72.com-一天快三秒-| www.d28.club-彩票六加一开奖| www.39da.com-购买七星彩票| www.2236.cn-彩票中心通知| www.9975.online玩彩老头作独家推荐| www.59346.com-人人爱彩票-| www.286763.com-福彩申请电话| www.xw72.com-彩6软件-| www.n44.bid-三地彩票123好| www.1222.net-我国体彩发行时间| www.33515.com-3d胆码预测凤彩网| www.74sb.com-天狼星七星彩预测| www.1861.hk-湖北快三怎么手机玩| www.9078.top-福彩三地谜语论坛| www.722976.com-常州市福彩-| www.302088.com-七星彩冷热码分析| www.385019.com-下载澳客彩票网| www.481438.com-喝彩中华恰好| www.521.xyz-重庆时时彩停机维护| www.4569.wang-顶尖的彩票软件源码| www.133454.com-上海彩票全部| www.xn40.com-七星彩19036期| www.458640.com-足彩竞猜301| www.78908.com-彩票书籍有用吗| www.935873.com-彩神uv喷绘机| www.682125.com-彩票微助手下载安装| www.331615.com-彩51彩票下载安装| www.538786.com-掌上彩票pro安卓| www.639338.com-体彩店网上经营| www.731921.com-福彩快三守号窍门| www.874766.com-亚博彩票可靠吗| www.961923.com-下载双彩网论坛官网| www.gw7.com-中国体彩香港快3| www.244114.com-福利彩票下载软件| www.47314.com-山东德州快三| www.52802.com-好彩头网站-| www.20118.com-南充市福彩网| www.de51.com-快三开内蒙-| www.858.space-极彩登陆网页| www.8185.in-高频彩票时间调整| www.59346.com-人人爱彩票-| www.057177.com-人人彩票网站下载| www.935808.com-足彩单关网易| www.3021.vip-众彩票线路导航| www.88418.cc-澳洲强力球彩票| www.02898.com-亚彩会平台怎么样| www.806393.com-八马彩票软件下载| www.336224.com-不让提现的彩票| www.501178.com-网址购彩可靠吗| www.622210.com-五福彩票登录| 华人彩票www.hr6888.com| www.200698.com-福利彩票昨晚开奖| www.322670.com-彩票123会员| www.010501.com-熊猫彩票网站| www.56481.cc-彩票新颖名字| www.040705.com-华夏彩票平台合法吗| www.424879.com-官方彩九app下载| www.548192.com-七星彩大公鸡规律图| www.636612.com-彩虹台机顶盒| www.725707.com-福彩双色球app| www.817162.com-广州市福彩中心官网| www.924508.com-众赢平台彩票| www.997293.com-时时彩彩八仙手机版| www.js41.cc-单双大小彩票app| www.035276.com-至尊大发快三| www.179691.com-福彩安徽快三下载| www.798947.com-竞彩数据分析| www.873547.com-网易购彩下载| www.938325.com-七星彩杀号开门彩| www.989168.com-彩票机器多少钱一台| www.mt.cc-彩票分析软件哪个好| www.md09.com-三分彩官网开奖结果| www.18ww.com-今晚七乐彩开奖预测| www.463.bid-m5彩票中心-| www.81637.com-快三多长时间开一次| www.67br.com-幸运分分彩论坛| www.1793.cm-乐彩超级大乐透论坛| www.150560.com-微彩彩票下载安装| www.567198.com-东京赛车彩票| www.504585.com-彩排的彩什么意思| www.269069.com-933c3彩票网| www.339007.com-福彩快3长龙记录| www.302924.com-彩22官网-| www.5194.cn-三d新彩吧-| www.739247.com-彩票杀号-| www.056531.com-安徽体彩兑奖在哪| www.140028.com-天津时时彩走势| www.40345.cc-宝哥足彩14场| www.785238.com-七星彩专家推荐汇总| www.882395.com-江苏快三开奖奖金| www.962603.com-大发彩票手机版本| www.cp8112.com-易彩彩票-| www.pq28.com-彩票36o-| www.356846.com-彩票复式怎么看中奖| www.042049.com-体彩竞彩怎么玩| www.89603.com-好彩蓝莓爆-| www.pp09.com-彩票投注手机平台| www.383.live-电子彩票中了怎么办| www.xb.cc-甘肃彩票快3图表| www.290736.com-手机百度内蒙快三| www.723790.com-每天买彩票的人| www.167772.com-上海快三走势图今天| www.sk37.com-私自卖彩票犯法吗| www.587.net-内蒙古福利彩票中心| www.878593.com-中国福彩积分服务| www.175601.com-下载快三预测软件| www.742580.com-免费注册送彩金38| www.59527.cc-谁有黑客彩票软件买| www.107054.com-福利彩票代销证查询| www.118524.com-常州福彩中奖规则| www.gt51.com-体育彩票排列三| www.e72.net-cba彩票投注| 大赢家彩票www.799425.com| www.133.cm-彩虹的约定视频大全| www.9182.biz-手机购买体育彩票| www.45532.com-贵州彩票全部| www.25bf.com-体育彩票几点开门| www.325364.com-七星彩头尾开奖结果| www.647986.com-体育彩票官方kj| www.526525.com-海南七星彩直播开| www.821023.com-彩色水泥价格| www.gt90.com-彩59这个app| www.953731.com-牛彩网摘要网| www.916040.com-湖北彩票官方网站| www.567684.com-66cp彩票-| www.105277.com-好彩双爆价格| www.588653.com-七星彩头尾怎么看的|