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.9248.cn-万达商城彩票怎么玩| www.381449.com-七乐彩哪个频道直播| www.33424.cc-福彩水果农场| www.695316.com-竞彩开奖结果彩客| www.cu67.com-开福利彩票店赚钱吗| www.u06.online-史上最高彩票| www.296257.com-江苏快三图-| www.509162.com-万利彩票手机客户端| www.803455.com-刚力彩芽为什么被黑| www.933829.com-彩票什么方法买号准| www.807801.com-彩票一等奖图片大全| www.959869.com-福彩帮投是什么意思| www.21fe.com-山西彩票20选8| www.6396.xyz-哈尔滨快三查询| www.496648.com-中国体彩怎么开店| www.53ab.com-买彩票花了多少钱了| www.560455.com-彩票收米动态图片| www.654074.com-金龙彩票下载安装| www.752422.com-小彩牛彩票-| www.825308.com-竞彩猫直播入口| www.918455.com-2345彩票计划网| www.975534.com-湖南福彩管理中心| www.cp317.com-福建快三中奖号码表| www.my78.com-2019彩票店前景| www.v59.cn-牛彩网一彩搜网| www.3879.bid-海南七星彩计划| www.343.cc-时时彩专业版星光| www.13bh.com-鼎盛彩票计划| www.6068.me-3d彩票秘诀-| www.17055.cc-可变条码彩票加工| www.74fv.com-排列五彩票开奖| www.505157.com-天下彩网-| www.020396.com-上海快三推荐和值| www.541779.com-彩票比分-| www.941236.com-彩票对冲套利方法| www.987583.com-福利彩票全国兑奖| www.ak40.com-鸿彩快三app| www.qa29.com-盈彩注册-| www.20tn.com-彩世界下载安装| www.035499.com-彩票合买统计| www.623865.com-快三查询图表| www.744223.com-彩宝网查询-| www.822455.com-彩票兑奖大厅地址| www.dt98.cc-湖北福彩中心地址| www.yp17.com-下载体彩扑克三| www.47sb.com-彩票站网上抢单| www.868.cm-水溶性彩铅-| www.609018.com-金彩网高手网福中网| www.716234.com-体彩天下网站| www.799114.com-彩票注册送彩金活动| www.885052.com-网络彩票代玩兼职| www.963187.com-河南南阳彩礼多少钱| 凤凰Vwww.www.fh7557.com| www.hv25.com-808彩票网早版| www.zc22.com-春秋彩票老版本| www.125164.com-彩票快三概率计算| www.11458.com-世界几大博彩公司| www.255089.com-时时彩注册送10元| www.347642.com-大发彩票黑平台| www.440999.com-复式体育彩票计算| www.38vn.com-甘肃彩礼-| www.0651.in-彩票随机号码生成| www.0186.org-爱心彩票app| www.6270.top-保定快三开奖结果着| www.015520.com-今天福彩3d九宝图| www.089196.com-168彩票假吗| www.088059.com-双赢彩票导师是托| www.856133.com-福少时时彩怎么样| www.410803.com-彩色纸盒包装厂家| www.598366.com-今晚七星彩前四码| www.733360.com-3d走势彩宝网| www.63769.cc-足彩交易量-| www.931607.com-如何看彩票中奖没有| 九五彩票www.959581.com| www.869553.com-家彩开奖app| www.954042.com-乐和彩竞彩是正规吗| www.cp6899.com-安徽省快三开奖结果| www.134729.com-体彩七位数走势图表| www.263820.com-中国体育彩票排列五| www.350869.com-10选1彩票技巧| www.46pn.com-彩票买5个数的| www.cp329.com-湖北福彩快三推荐| www.02240.com-955彩票是真的吗| www.618041.com-我国体育彩票上市| www.712114.com-快三是有人控制嘛| www.909308.com-宝马彩票平台靠谱吗| 易彩集团www.25688h.com| www.rp14.com-彩之王江苏快3| www.80cf.com-金誉彩票手机版下载| www.861626.com-福利彩票店几点下班| www.474747.com-竞彩篮球彩票安卓| www.642737.com-福彩三d坐标图| www.948217.com-三地牛彩网图谜| www.93dm.com-英国5分彩平台| www.570059.com-注册送彩金博彩| www.391198.com-龙胜彩票下载平台| www.654390.com-江西体彩兑奖中心| www.32921.com-e彩在线手机版| www.2907.cn-辽宁福彩十二选五开| www.67903.com-网上玩博彩违法吗| www.807271.com-手机在线体彩下载| www.pf2.com-彩票中奖不捐款行吗| www.879122.com-七星彩奖表最新| www.977569.com-世界杯足彩怎么买| www.014909.com-彩票牛人求职| www.252827.com-重庆老时时彩走势图| www.352236.com-举报网络彩票有用吗| www.455599.com-老公爱买彩票怎么治| www.568950.com-今天安徽快三开奖| www.671350.com-天津体彩网11选5| www.791946.com-竞彩有漏洞吗| www.893456.com-快三和值有奖金吗| www.974635.com-皇室彩票官网| www.cw92.com-431彩票-| www.04eq.com-彩客彩票吧-| www.90ho.cc-美国彩票30亿大奖| www.30119.com-安卓彩8娱乐| www.020108.com-特彩吧手机开奖结果| www.521705.com-vb彩票选号器| www.630225.com-福彩高手论坛首页| www.866979.com-星期日开什么彩票| www.7997.loan-nba引进博彩| www.62339.cc-彩票大赢家预测| www.135104.com-计划彩票聊天室| www.462832.com-体彩排列三怪字神贴| www.628883.com-好彩客破解-| www.881945.com-双彩工作室-| www.216234.com-分分时时彩技巧实战| www.369315.com-第三方彩票数据接口| www.684337.com-体彩彩票开奖查31| www.204988.com-彩票万能准确选号器| www.544026.com-福彩小军3d第二版| www.98099.cc-三分时时彩公式技巧| www.73591.com-海南彩开奖结果| www.072415.com-乐亿彩票平台app| www.161997.com-吉彩挣钱是真还是假| www.96151.cc-支持花呗充值的彩票| www.227676.com-福彩网055dcc| www.400205.com-在哪里众筹买彩票| www.557571.com-彩运来官网登入| www.628995.cc-福利彩票代打| www.710528.com-首充100送彩金| www.787367.com-雪园缘足彩比分直播| www.869552.com-唯彩会旧版本| www.5520.online福彩3d购买方案| www.95752.com-中国足彩在线的微博| www.122423.com-彩世界时时彩软件| www.256129.com-全球彩票历史版本| www.409965.com-彩票平台源码在哪找| www.562728.com-彩票中奖到哪里领取| www.663117.com-凤凰彩票的老板| www.429757.com-宝利彩票靠谱吗| www.7610.com-老彩民乐图-| www.76009.com-竞彩理财投资计划表| www.751407.com-彩票聋哑人-| www.826826.com-京东买彩票在哪里买| www.343.cc-时时彩专业版星光| www.97432.com-古建彩绘颜料经销处| www.716338.com-古风彩铅画-| www.803801.com-海南彩票app下载| www.87pv.com-体彩大乐开奖规则| www.2762.com-唐山中彩票3亿多| www.77788.cc-新浪彩票频道首页| www.197741.com-地方彩-|