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天

知道了
亚洲28 www.25872.cc-聚彩彩票jc-| www.26822.cc-体彩七星彩的买法| www.359863.com-中华彩票9149| www.529608.com-竞彩网中国足彩网| www.697611.com-清明节彩票放假| www.882327.com-078彩票骗局| www.997388.com-体彩8号店app| www.nz65.com-贵宾室彩票软件| www.xq80.com-酷彩吧靠谱吗| www.089.bid-淘金彩票是真的吗| www.100083.cc-领先彩票-| www.270244.com-宫网567cc彩票| www.369841.com-体彩大乐透几点封盘| www.489877.cc-七彩乐中奖结果| www.079610.com-网购彩票江苏快三| www.qb19.com-查询彩票app| www.57qv.com-大乐透中大奖彩票图| www.2019.pw-旺球彩店最新app| www.01704.com-彩票中福在线收益| www.087146.com-云彩厅-| www.659426.com-七星彩票今天开| www.772490.com-荣誉彩票下载安装| www.pe.com-网络快三输了十几万| www.og94.com-江苏福彩3d走势图| www.638.red-腾讯分分彩百度贴吧| www.8523.wang-福彩3d质合是什么| www.670158.com-买彩票一共几位数| www.119661.com-乐彩网缩水工具| www.351589.com-买彩票中一注多少钱| www.173837.com-快三赌博骗局的真相| www.32fd.com-周一福利彩票有哪些| www.53672.cc-709手机版时时彩| www.043246.com-高频彩票刷流水| www.35822.cc-发彩网怎么赚钱| www.160057.com-福彩自助投注机加盟| www.336657.com-彩票总是输-| www.121763.com-五亿彩是真的吗| www.282291.com-台湾时时彩真不真实| www.054546.com-大连体彩店出租合作| www.217663.com-新快三街机游戏大全| www.306878.com-快三高手群-| www.381301.com-体彩店微信代打| www.507569.com-苏宁彩票加盟| www.32el.com-今天开的彩票| www.690327.com-足彩14开奖走势图| www.102945.com-广东福利彩票好彩2| www.812927.com-网易彩票直播首页| www.905606.com-福建省福彩中心在哪| www.971559.com-体彩排3走势图| www.xb58.com-微采网彩票-| www.296171.com-快三带玩彩票| www.369614.com-体彩卩3试机号| www.479228.com-竞彩高手看盘心得| www.687993.com-318彩票下载| www.813695.com-彩票上的条码怎么看| www.931079.com-南洋彩怎么查| www.cp0088.com-今日甘肃快三一定牛| www.67ur.com-乐彩vip客户端| www.33622.cc-彩神通关注碼| www.lr54.com-大中华彩票手机版| www.50qa.com-玩时彩把赢的钱输了| www.019607.com-湖南体彩赛车| www.15zx.com-彩虹10首飞| www.32551.com-快三守号输了几十万| www.42508.com-网络彩票坑死了| www.w90.top-彩票对打方法| www.335486.com-3d彩票-| www.705272.com-福彩中心主任鲍学全| www.791749.com-时时彩坑人秘密| www.805584.com-足彩软件哪个好| www.027007.com-正规的彩票合买系统| www.559448.com-彩16下载下载| www.5829.cn-体育彩票年度会议| www.06810.com-福彩3d万能6码| www.020941.com-众彩网安全吗| www.038266.com-手机app彩票| www.933593.com-福建体育彩票3l| www.997914.com-乐彩图表工具图| www.ck51.com-吉林快三走势跨度值| www.533489.com-现在哪个彩票最好| www.678069.com-好彩门户开奖| www.815968.com-快三怎么买大小| www.948158.com-江西体彩中心官网| www.cai0577.com宁夏快三实时走势图| www.2hb.com-福利彩票买截止时间| www.380163.com-乐彩牛彩网网| www.539507.com-彩宝贝预测汇总对比| www.612796.com-彩牛瓷砖美缝剂色板| www.683709.com-彩票实体店app| www.757378.com-体育彩票任选九规则| www.914921.com-牛彩3d图谜汇总九| www.969173.com-天天彩票是合法的吗| 500彩票www.175905.com| www.1191.in-彩票分析预测表| www.3557.xyz-送38元彩金-| www.mp46.com-吉林快三有多少注| www.9285.online吉林快三和值号码表| www.737766.com-彩票网360-| www.814918.com-彩票基本-| www.894870.com-重庆时时彩投注站| www.962574.com-旺旺彩票二维码| 500彩票www.338035.com| www.8853.cn-七乐彩中几个数有奖| www.836256.com-迪士尼彩乐园| www.543916.com-武汉双机彩票站转让| www.634896.com-建盏怎样煮出七彩来| www.344041.com-谁有彩民群-| www.595352.com-新浪足彩论坛| www.689607.com-中国彩票网上投注| www.796333.com-彩尊平台登录| www.898680.com-香港致富彩-| www.977576.com-彩票介绍-| www.oi57.com-福利彩票吉林快三| www.318229.com-博彩nba-| www.02421.cc-体彩天下app下载| www.979786.com-快三在线预测| www.550040.com-足彩致富-| www.841155.com-中国彩票实战讲座2| www.928390.com-福彩三d天庚大帝| www.990244.com-趣彩网官网-| www.12eo.com-柬埔寨5分钟彩| www.83pm.com-福彩3d表图-| www.1543.cn-十位走走势图中彩网| www.670468.com-彩票预测七星彩| www.090169.com-盈发彩票官网| www.938855.com-福利彩票快3河南| 吉利彩票www.80065b.com| www.996466.com-足彩佬牛新浪慱客| www.694336.com-彩票店只卖3d| www.1014.vip-快开被限制福彩| www.7505.cc-在体彩店上班怎样| www.11.date-黑客攻击时时彩网站| www.747733.com-幸运彩网站登入| www.1000.pro-小乐彩app-| www.06466.com-中国福彩3d吧| www.365088.com-澳门惠民彩资科| www.678740.com-中超足彩哪里买| www.491909.com-彩彩之网互动区| www.8sn.com-买彩票的玩法| www.094562.com-彩票外挂-| www.182132.com-038彩票骗局| www.04316.com-吉林快三出号规律| www.898963.com-9亿彩票app-| www.975786.com-云购彩票下载安装| www.kq98.com-七星彩中奖概率| www.586965.com-竞彩哪里买好点| www.748765.com-95彩票邀请码| www.862244.com-澳客电脑版彩票网页| www.930046.com-体彩排列3基本走式| 万历彩票www.77114e.com| www.886066.com-五洲彩票注册登录| www.639779.com-一分彩牛牛-| www.784948.com-七星彩欣雨统精华版| www.884061.com-乐彩网10-| www.941456.com-彩票站经营思路| www.987987.cc-中彩堂软件-| www.cp5034.com-吉林快三技巧顺口溜| www.024721.com-竞彩全包最牛技巧| www.08123.cc-福彩3d模拟器| www.014155.com-在哪里买彩票靠谱| www.5se.com-昆明福牛牛彩票网| www.67rx.com-彩票中奖去哪领取| www.003040.com-3d彩票软件破解版| www.507186.com-如何用百度扫彩票|