QQ客服
当前位置 : 首页 > 代码 > 网页特效 > 选项卡/滑动门 > jquery大气企业解决方案选项卡布局代码

原创商用 jquery大气企业解决方案选项卡布局代码

jquery企业建站解决方案展示内容选项卡切换效果,通过鼠标悬停导航标签栏,切换对应内容效果代码。基于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.js"></script>
<script type="text/javascript" src="js/jquery.SuperSlide.2.1.1.js"></script>

3、body引入HTML代码

<div class="solution-box">
	<div class="solution-bj">
		<div class="solution-header">
			<h2>为您量身定制解决方案</h2>
			<p>满足广泛的业务需求</p>
		</div>
		<div class="solution-content clearfix">
			<div class="solution-list hd">
				<ul>
					<li class="on">
						<h2>电商解决方案</h2>
					</li>
					<li>
						<h2>车联网解决方案</h2>
					</li>
					<li>
						<h2>制造解决方案</h2>
					</li>
					<li>
						<h2>游戏解决方案</h2>
					</li>
					<li>
						<h2>安全解决方案</h2>
					</li>
					<li>
						<h2>通用解决方案</h2>
					</li>
					<li>
						<h2>DevOps解决方案</h2>
					</li>
				</ul>
			</div>
			<div class="solution-item bd">
				<ul style="display:block">
					<li>
						<div>
							<h2>电商解决方案</h2>
							<p>结合丰富的行业平台服务和基础云服务,提供端到端电商解决方案,构建企业自有电商生态。可快速搭建电商平台,快速完成所有资源的创建和配置</p>
							<a href="javascript:;" class="s-btn solution-more">了解更多<em></em></a>
						</div>
					</li>
					<li>
						<div>
							<div class="solution-title">
								<h3>推荐解决方案</h3>
								<span></span>
							</div>
							<div class="solution-brand clearfix">
								<div class="solution-brand-item">
									<a href="#">
										<i><img src="images/icon1-1.png" alt=""></i>
										<p>家电数码</p>
									</a>
								</div>
								<div class="solution-brand-item">
									<a href="#">
										<i><img src="images/icon1-2.png" alt=""></i>
										<p>跨境贸易</p>
									</a>
								</div>
								<div class="solution-brand-item">
									<a href="#">
										<i><img src="images/icon1-3.png" alt=""></i>
										<p>鞋服</p>
									</a>
								</div>
								<div class="solution-brand-item">
									<a href="javascript:;" class="s-btn solution-more">查看更多<em></em></a>
								</div>
							</div>
						</div>
					</li>
					<li>
						<div>
							<div class="solution-title">
								<h3>案例和合作伙伴</h3>
								<span></span>
							</div>
							<div class="solution-brand clearfix">
								<div class="solution-brand-item clear">
									<a href="#">
										<img src="images/logo1.png" alt="">
									</a>
								</div>
								<div class="solution-brand-item clear">
									<a href="#">
										<img src="images/logo2.png" alt="">
									</a>
								</div>
								<div class="solution-brand-item clear">
									<a href="#">
										<img src="images/logo3.png" alt="">
									</a>
								</div>
							</div>
						</div>
					</li>
				</ul>
				<ul>
					<li>
						<div>
							<h2>车联网解决方案</h2>
							<p>依托“端-管-云”优势,提供包括IoT、大数据分析、应用使能以及安全管理等服务,构建面向亿级联接的车联网云平台,助力企业向出行服务提供商转型,让人车生活更智能</p>
							<a href="javascript:;" class="s-btn solution-more">了解更多<em></em></a>
						</div>
					</li>
					<li>
						<div>
							<div class="solution-title">
								<h3>推荐解决方案</h3>
								<span></span>
							</div>
							<div class="solution-brand clearfix">
								<div class="solution-brand-item">
									<a href="#">
										<i><img src="images/icon2-1.png" alt=""></i>
										<p>新能源车监管</p>
									</a>
								</div>
								<div class="solution-brand-item">
									<a href="#">
										<i><img src="images/icon2-2.png" alt=""></i>
										<p>智慧停车</p>
									</a>
								</div>
								<div class="solution-brand-item">
									<a href="#">
										<i><img src="images/icon2-3.png" alt=""></i>
										<p>T-BOX边缘计算</p>
									</a>
								</div>
								<div class="solution-brand-item">
									<a href="javascript:;" class="s-btn solution-more">查看更多<em></em></a>
								</div>
							</div>
						</div>
					</li>
					<li>
						<div>
							<div class="solution-title">
								<h3>案例和合作伙伴</h3>
								<span></span>
							</div>
							<div class="solution-brand clearfix">
								<div class="solution-brand-item clear">
									<a href="#">
										<img src="images/logo4.png" alt="">
									</a>
								</div>
								<div class="solution-brand-item clear">
									<a href="#">
										<img src="images/logo5.png" alt="">
									</a>
								</div>
								<div class="solution-brand-item clear">
									<a href="#">
										<img src="images/logo6.png" alt="">
									</a>
								</div>
							</div>
						</div>
					</li>
				</ul>
				<ul>
					<li>
						<div>
							<h2>制造解决方案</h2>
							<p>结合近30年工业制造经验和基础云服务,基于全流程整合能力打造的可信、开放工业云服务平台,为制造企业提供端到端的数字化转型解决方案,助力企业数字化,智能化升级</p>
							<a href="javascript:;" class="s-btn solution-more">了解更多<em></em></a>
						</div>
					</li>
					<li>
						<div>
							<div class="solution-title">
								<h3>推荐解决方案</h3>
								<span></span>
							</div>
							<div class="solution-brand clearfix">
								<div class="solution-brand-item">
									<a href="#">
										<i><img src="images/icon3-1.png" alt=""></i>
										<p>云设计</p>
									</a>
								</div>
								<div class="solution-brand-item">
									<a href="#">
										<i><img src="images/icon3-2.png" alt=""></i>
										<p>云仿真</p>
									</a>
								</div>
								<div class="solution-brand-item">
									<a href="#">
										<i><img src="images/icon3-3.png" alt=""></i>
										<p>云MES</p>
									</a>
								</div>
								<div class="solution-brand-item">
									<a href="javascript:;" class="s-btn solution-more">查看更多<em></em></a>
								</div>
							</div>
						</div>
					</li>
					<li>
						<div>
							<div class="solution-title">
								<h3>案例和合作伙伴</h3>
								<span></span>
							</div>
							<div class="solution-brand clearfix">
								<div class="solution-brand-item clear">
									<a href="#">
										<img src="images/logo15.png" alt="">
									</a>
								</div>
								<div class="solution-brand-item clear">
									<a href="#">
										<img src="images/logo18.png" alt="">
									</a>
								</div>
								<div class="solution-brand-item clear">
									<a href="#">
										<img src="images/logo7.png" alt="">
									</a>
								</div>
							</div>
						</div>
					</li>
				</ul>
				<ul>
					<li>
						<div>
							<h2>游戏解决方案</h2>
							<p>我们的服务涵盖游戏整个生命周期,从构建基础设施,到快速发布游戏,再到游戏精细化运营,直到推广创收,腾讯云“互联网+游戏”全部覆盖业界领先的BGP网络、节点遍布全国</p>
							<a href="javascript:;" class="s-btn solution-more">了解更多<em></em></a>
						</div>
					</li>
					<li>
						<div>
							<div class="solution-title">
								<h3>推荐解决方案</h3>
								<span></span>
							</div>
							<div class="solution-brand clearfix">
								<div class="solution-brand-item">
									<a href="#">
										<i><img src="images/icon4-1.png" alt=""></i>
										<p>游戏云端</p>
									</a>
								</div>
								<div class="solution-brand-item">
									<a href="#">
										<i><img src="images/icon4-2.png" alt=""></i>
										<p>游戏容器部署</p>
									</a>
								</div>
								<div class="solution-brand-item">
									<a href="#">
										<i><img src="images/icon4-3.png" alt=""></i>
										<p>游戏开发</p>
									</a>
								</div>
								<div class="solution-brand-item">
									<a href="javascript:;" class="s-btn solution-more">查看更多<em></em></a>
								</div>
							</div>
						</div>
					</li>
					<li>
						<div>
							<div class="solution-title">
								<h3>案例和合作伙伴</h3>
								<span></span>
							</div>
							<div class="solution-brand clearfix">
								<div class="solution-brand-item clear">
									<a href="#">
										<img src="images/logo14.png" alt="">
									</a>
								</div>
								<div class="solution-brand-item clear">
									<a href="#">
										<img src="images/logo13.png" alt="">
									</a>
								</div>
								<div class="solution-brand-item clear">
									<a href="#">
										<img src="images/logo12.png" alt="">
									</a>
								</div>
							</div>
						</div>
					</li>
				</ul>
				<ul>
					<li>
						<div>
							<h2>安全解决方案</h2>
							<p>云以安全能力为基石,以法律法规遵从为城墙,以安全生态为护城河,构建起面向不同行业的保障体系,为客户提供一站式的安全解决方案,帮助客户快速、低成本完成安全整改</p>
							<a href="javascript:;" class="s-btn solution-more">了解更多<em></em></a>
						</div>
					</li>
					<li>
						<div>
							<div class="solution-title">
								<h3>推荐解决方案</h3>
								<span></span>
							</div>
							<div class="solution-brand clearfix">
								<div class="solution-brand-item">
									<a href="#">
										<i><img src="images/icon5-1.png" alt=""></i>
										<p>通用安全</p>
									</a>
								</div>
								<div class="solution-brand-item">
									<a href="#">
										<i><img src="images/icon5-2.png" alt=""></i>
										<p>等保合规安全</p>
									</a>
								</div>
								<div class="solution-brand-item">
									<a href="#">
										<i><img src="images/icon5-3.png" alt=""></i>
										<p>SAP安全</p>
									</a>
								</div>
								<div class="solution-brand-item">
									<a href="javascript:;" class="s-btn solution-more">查看更多<em></em></a>
								</div>
							</div>
						</div>
					</li>
					<li>
						<div>
							<div class="solution-title">
								<h3>案例和合作伙伴</h3>
								<span></span>
							</div>
							<div class="solution-brand clearfix">
								<div class="solution-brand-item clear">
									<a href="#">
										<img src="images/logo4.png" alt="">
									</a>
								</div>
								<div class="solution-brand-item clear">
									<a href="#">
										<img src="images/logo5.png" alt="">
									</a>
								</div>
								<div class="solution-brand-item clear">
									<a href="#">
										<img src="images/logo6.png" alt="">
									</a>
								</div>
							</div>
						</div>
					</li>
				</ul>
				<ul>
					<li>
						<div>
							<h2>通用解决方案</h2>
							<p>基于丰富的基础云服务,为解决跨行业共性问题而提供的统一技术架构的、适用于多行业的、预集成的产品与能力的组合,以满足客户ICT业务上云的需求</p>
							<a href="javascript:;" class="s-btn solution-more">了解更多<em></em></a>
						</div>
					</li>
					<li>
						<div>
							<div class="solution-title">
								<h3>推荐解决方案</h3>
								<span></span>
							</div>
							<div class="solution-brand clearfix">
								<div class="solution-brand-item">
									<a href="#">
										<i><img src="images/icon6-1.png" alt=""></i>
										<p>SAP</p>
									</a>
								</div>
								<div class="solution-brand-item">
									<a href="#">
										<i><img src="images/icon6-2.png" alt=""></i>
										<p>HPC</p>
									</a>
								</div>
								<div class="solution-brand-item">
									<a href="#">
										<i><img src="images/icon6-3.png" alt=""></i>
										<p>移动互联</p>
									</a>
								</div>
								<div class="solution-brand-item">
									<a href="javascript:;" class="s-btn solution-more">查看更多<em></em></a>
								</div>
							</div>
						</div>
					</li>
					<li>
						<div>
							<div class="solution-title">
								<h3>案例和合作伙伴</h3>
								<span></span>
							</div>
							<div class="solution-brand clearfix">
								<div class="solution-brand-item clear">
									<a href="#">
										<img src="images/logo7.png" alt="">
									</a>
								</div>
								<div class="solution-brand-item clear">
									<a href="#">
										<img src="images/logo8.png" alt="">
									</a>
								</div>
								<div class="solution-brand-item clear">
									<a href="#">
										<img src="images/logo10.png" alt="">
									</a>
								</div>
							</div>
						</div>
					</li>
				</ul>
				<ul>
					<li>
						<div>
							<h2>DevOps解决方案</h2>
							<p>基于项目管理、代码托管、持续集成、测试、部署、发布、流水线等端到端工具链,使能软件企业或团队应用DevOps方法论与优秀实践,将软件产品价值持续交付给最终用户</p>
							<a href="javascript:;" class="s-btn solution-more">了解更多<em></em></a>
						</div>
					</li>
					<li>
						<div>
							<div class="solution-title">
								<h3>推荐解决方案</h3>
								<span></span>
							</div>
							<div class="solution-brand clearfix">
								<div class="solution-brand-item">
									<a href="#">
										<i><img src="images/icon7-1.png" alt=""></i>
										<p>软件实训</p>
									</a>
								</div>
								<div class="solution-brand-item">
									<a href="#">
										<i><img src="images/icon7-2.png" alt=""></i>
										<p>游戏开发</p>
									</a>
								</div>
								<div class="solution-brand-item">
									<a href="#">
										<i><img src="images/icon7-3.png" alt=""></i>
										<p>电商双交付</p>
									</a>
								</div>
								<div class="solution-brand-item">
									<a href="javascript:;" class="s-btn solution-more">查看更多<em></em></a>
								</div>
							</div>
						</div>
					</li>
					<li>
						<div>
							<div class="solution-title">
								<h3>案例和合作伙伴</h3>
								<span></span>
							</div>
							<div class="solution-brand clearfix">
								<div class="solution-brand-item clear">
									<a href="#">
										<img src="images/logo17.png" alt="">
									</a>
								</div>
								<div class="solution-brand-item clear">
									<a href="#">
										<img src="images/logo18.png" alt="">
									</a>
								</div>
								<div class="solution-brand-item clear">
									<a href="#">
										<img src="images/logo15.png" alt="">
									</a>
								</div>
							</div>
						</div>
					</li>
				</ul>
			</div>
		</div>
		<div class="solution-more-wrap">
			<a href="javascript:;" class="s-btn solution-more">查看所有解决方案<em></em></a>
		</div>
	</div>
</div>

<script type="text/javascript">
	jQuery(".solution-content").slide({});
</script>
[声明]本站素材来自用户分享,仅限学习交流请勿用于商业用途。如损害你的权益请联系客服QQ:2447402004给予处理。
举报×
举报原因:

相关代码

二维码
意见反馈
×
×

注册

QQ注册 立即下载 新浪注册 立即下载

签到成功!

已连续签到1天,签到3天将获得积分VIP1天

知道了
彩01彩票 www.683775.com-中彩网正版下载| www.475315.com-时时彩任三直选| www.ny25.com-彩票驿站邀请码| www.39ce.com-彩票几点开门| www.3092.cn-彩神好运来幸运飞艇| www.078987.com-七星彩复式奖金计算| www.188087.com-时时彩四大铁律| www.282393.com-铁公鸡彩票规律表| www.73417.com-彩圣网全年资料| www.358861.com-体彩3+1多少钱| www.721014.com-袁老师看福彩快3| www.c78.loan-河内5分彩开奖直播| www.3348.in-梦到彩色的鸟| www.116025.com-新手买足彩-| www.46447.com-时时彩开奖时间更改| www.026192.com-开私彩怎么判刑| www.212044.com-快三彩票平台app| www.785584.com-特彩吧原彩票高手网| www.kd95.com-新快三娱乐-| www.326295.com-彩宝彩票官方版下载| www.613189.com-玩彩哪个平台最大| www.777624.com-12cc彩票-| www.949723.com-160彩票官方网站| www.pq69.com-福彩3d做号软件| www.714487.com-游戏厅推币彩票| www.818378.com-彩票开奖现场直播| www.898248.com-足球彩票的区别在哪| www.359069.com-体彩多少选多少| www.kn37.com-k3福彩官方邀请码| www.903363.com-内蒙古福彩地址| 七彩www.53911a.com| www.1581.net-七星彩怎样寻找规律| www.791178.com-彩票金融-| www.236300.cc-福彩手机购彩平台| www.ol99.com-河北快三一定牛开奖| www.997094.com-3d福彩开奖历史| www.923098.com-彩色纸箱定制厂| www.lp34.com-创富彩票平台靠谱吗| www.04540.com-微信支付买足彩| www.74047.com-台湾彩虹旗什么意思| www.86yh.com-深圳体彩11选五| www.4990.biz-彩晶膜-| www.51475.cc-福彩6选3玩法| www.zl22.cc-双彩网真实谎言| www.982474.com-彩票店中奖提成多少| www.f60.net-中国福利彩票st5| www.6040.org-云南福彩大奖得主| www.58729.cc-竞彩牛师傅-| www.122245.com-福彩现在能买吗| www.083063.com-休体彩票31选7| www.652116.com-葡京彩票是什么骗局| www.143460.com-彩票快3怎么买得中| www.337282.com-今晚七彩码开奖| www.564277.com-深圳东方亮彩厂| www.840088.com-电脑彩正版八肖图| www.571633.com-吉林快三人工计划群| www.715192.com-好彩五分快三导师群| www.849044.com-旺旺时时彩app| www.19lw.com-彩亿电商靠谱吗| www.99rx.com-福彩快三摇骰子官网| www.675283.com-中国竞彩网专家推荐| www.590078.com-竞彩官方公众号| www.777158.com-下载锋彩直播| www.874169.com-福彩新基诺-| www.fd07.com-足球彩票四大欧赔| www.52532.cc-足彩258下载| www.591157.com-福彩排列7玩法| www.668026.com-和乐彩票网站多少| www.745338.com-11cc彩票下载| www.816127.com-彩票双色规则| www.883238.com-鸿彩灯光官网灯库| www.987226.com-福彩公益金全民| www.vm4.com-马来西亚当地彩票| www.vj92.com-体彩排列三最准断组| www.248008.com-快三辅助下载| www.350426.com-天下彩资料大全综合| www.445168.com-西安市彩票店转让| www.593488.com-七彩阳光完整版| www.728715.com-中国彩票七星彩| www.808090.com-大优彩票平台登录| www.928832.com-大乐斗彩票怎么玩| E彩堂www.9818v.cc| www.570404.com-快彩计划软件手机版| www.655211.com-南国南国彩票论坛| www.730952.com-易彩堂是官方彩吗| www.799679.com-快三最高中奖纪录| www.867252.com-体彩6十1停售时间| www.924958.com-江苏体彩七位数预测| www.975002.com-055hcc福彩-| www.cp6236.com-500彩票-| www.99rt.cc-时时彩宝典视频开奖| www.697308.com-福彩三d彩吧图库| www.778108.com-购彩计划-| www.857368.com-体彩超绍大乐透开奖| www.006361.com-好彩一开奖历史| www.18995.cc-福彩3d助手助| www.64ue.com-彩票站代买-| www.444897.com-未央福彩转让| www.540730.com-玩北京快三有危险吗| www.614030.com-看图买生肖彩票| www.750898.com-彩46.apk-| www.858954.com-彩神vll攻略| www.970721.com-买彩票鼓励的话语| www.ph61.com-江苏快三qq计划群| www.036502.com-查七乐彩-| www.333668.com-年会送员工彩票| www.389755.com-体育彩票店在哪| www.692389.com-大发快开彩有规律吗| www.795878.com-中双色彩票图| www.881030.com-黑彩平台信誉排行榜| www.954884.com-七彩祥云头像| 万历彩票www.77114v.com| www.tf21.com-安徽快三跨度表| www.26gi.com-福彩体彩对联| www.0347.hk-福州体彩中心电话| www.8988.in-高频彩信誉排行榜| www.113245.com-中奖彩票ios版| www.26268.cc-广东福利彩票| www.78798.com-北京体彩单场胜平负| www.79rs.com-海口快三开奖结果| www.121028.com-网络彩票计划员| www.320163.com-3月2号体彩开奖| www.30707.com-彩票3d没人中过吗| www.0995.site-高频快彩是什么| www.9534.top-什么彩票4位数| www.996018.com-彩通官网-| www.ak13.com-360彩票走势图| www.pg28.com-时时彩追遗漏| www.1xy.cc-彩色笔画-| www.888829.com-彩站宝二维码| www.092753.com-周口那边彩礼多少| www.222229.com-春节后彩票几号开售| www.974761.com-最新彩市新闻| www.467366.com-彩票几点停止售票| www.584388.com-能借钱的彩票平台| www.658565.com-彩视如何设置全屏| www.859030.com-彩票规定返奖| www.924100.com-彩票833-| www.97018.com-重庆市福彩中心| www.215701.com-青海快三官网| www.316391.com-22彩票中心-| www.156227.com-kg彩票骗局大揭秘| www.226198.com-大学生破解彩票漏洞| www.292736.com-河南派彩网-| www.365895.cc-福彩3d组选遗漏| www.443603.com-彩94-| www.366755.com-中国体育体彩店图片| www.95719.com-河南郸城结婚彩礼| www.371465.com-577彩票apk-| www.501720.com-全球彩票093| www.575908.com-彩票注册就送彩金| www.650326.com-托班彩虹伞游戏玩法| www.720051.com-复式七星彩中奖查询| www.093062.com-湖北恩施彩钢围挡| www.040.net-新彩有收藏价值吗| www.2886.biz-彩票导刊彩票与生活| www.7048.cc-买彩票的-| www.05536.com-彩票51下载手机版| www.99hy.com-8828yy彩票-| www.5080.vip-能用手机买福彩吗| www.18xf.com-我要看七乐彩开奖| www.93513.cc-800万彩票-| www.716869.com-48色彩铅排序色卡| www.137894.com-中国福彩中奖查询|