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天

知道了
1分快三 www.33oz.com-七星彩自动画规软件| www.3937.me-英国幸运彩-| www.09673.com-手机如何买3d彩票| www.61916.cc-领航彩下载-| www.069528.com-彩神争霸8lx| www.149003.com-互彩宝-| www.259657.com-快三计划免费软件| www.345061.com-体育彩票手游| www.445541.com-基诺型彩票是什么| www.551262.com-香彩票全年资料| www.700450.com-360彩票不能买了| www.789351.com-彩妆蛋-| www.875009.com-福彩20选8陕西| www.971125.com-乐米彩票中奖不承认| www.cx23.com-神彩8‖-| www.xj07.cc-唯彩会彩票下载安装| www.25ob.com-白银彩票电话| www.0243.cm-众乐彩票能相信吗| www.7378.org-竞彩店没客户| www.28658.com-普通人中不了彩票| www.79313.cc-龙江福彩p62开奖| www.045007.com-彩乐网网站-| www.173335.com-极速快三怎么看计划| www.271871.com-百宝彩湖北快3| www.365931.cc-福彩3d历史开奖号| www.476805.com-蚂蚁金服彩票| www.564012.com-多彩贵州城旅游| www.649579.com-澳门理工博彩学院| www.779329.com-今晚体彩七位数预测| www.866415.com-搜狐网彩票版| www.937789.com-好彩网3d顶测| www.997642.com-时时彩职业玩家心得| www.bk45.com-大小单双彩票| www.va86.com-幸运彩幸运二任选| www.17pc.com-湖北快三倍投技巧| www.3024.top-金祥彩票网址| www.9829.loan-快三和值跨度| www.64922.com-旧版竞彩足球即比分| www.029856.com-神舟彩票官网首页| www.112806.com-辽宁极速快三查询| www.189469.com-广西体彩-| www.266918.com-282cc天下彩| www.464530.com-我要看彩票-| www.558060.com-复杂彩铅画大全| www.632377.com-吉林快三彩经网开将| www.710029.com-集彩彩票-| www.790461.com-广东好彩一开什么| www.863538.com-时时彩数据导入| www.925551.com-旭彩美缝剂厂家| www.979945.com-顶级彩票票主页| www.ux06.com-福彩青海快三走势图| www.14ni.com-湖北恩施结婚彩礼钱| www.107.cc-3d彩报图集-| www.3772.xyz-南国彩票排列五| www.9562.net-海南七星彩图版| www.66439.com-彩票网上可以兑奖吗| www.027921.com-彩票o2o-| www.107096.com-澳洲3分彩-| www.180198.com-彩票王牌app| www.256110.com-北京丹彩快三| www.332559.com-谁有好点的黑彩平台| www.409119.com-澳洲3分彩投注技巧| www.517306.com-安徽体彩中心在哪里| www.589630.com-香港七星彩趣味看图| www.664374.com-兴博彩票qq群| www.739462.com-极云彩票销售系统| www.814910.com-河北省体育彩票中心| www.889280.com-王者彩票下载| www.cs27.com-体彩大发快3| www.up17.com-福彩3d五行图| www.08wl.com-体彩排列三组选开奖| www.79vt.com-百盛彩托都聊感情| www.1798.mobi-彩吧网论坛首页| www.07305.com-澳彩大盘升盘| www.53378.cc-杭州彩虹冰淇淋机| www.97909.cc-快三是即开型彩票吗| www.063993.com-中国体育彩票3d| www.180222.com-上海快三最新结果| www.254381.com-内蒙古快三跨度| www.331109.com-0234大发彩-| www.400603.com-七星彩1500万奖| www.561297.com-彩票交流网-| www.630426.com-好彩爆珠台版| www.700073.cc-福彩2d奖金-| www.777851.com-开私彩网站-| www.892428.com-查询彩票最好的软件| www.961821.com-可以购彩票软件| 大赢家彩票平台www.081306.com| www.gq09.com-安徽快三500彩票| www.xo80.com-新编彩票投注技巧| www.17bm.cc-华夏鑫彩积分互通| www.804.tv-彩6彩票网站| www.5021.org-九鼎彩票网是真的吗| www.02366.com-购买私彩-| www.68136.cc-重庆时乐彩开奖号码| www.028863.com-中国彩吧彩报图库| www.106830.com-七彩娱乐账号注册| www.176078.com-快三软件能破解吗| www.281911.com-彩票复式-| www.365375.cc-3d直击黑彩-| www.450374.com-七乐彩最新开奖号码| www.538199.com-体彩哪种最容易中奖| www.640521.com-爱彩网app靠谱吗| www.727612.com-北京福彩快乐十分| www.800458.com-彩票app白菜| www.873811.com-彩31是不是骗局| 吉利彩票www.80075k.com| www.fa09.com-大发快三破解软件| www.vm09.com-湖北福彩快三技巧| www.12je.com-用彩色造句怎么造| www.78ko.com-国外专业足彩| www.1428.vip-购彩快3投注技巧| www.05951.com-中国足彩竞彩app| www.48351.com-足彩竞彩购彩app| www.91665.cc-ap彩票-| www.043156.com-彩票害人家破人亡| www.153686.com-足球竟彩单场推荐| www.238602.com-大发时时彩全天计划| www.310330.com-长春市体育彩票中心| www.376617.com-最快的彩票开奖平台| www.517866.com-迷彩科技彩票软件| www.583101.com-福彩四等奖-| www.653166.com-49彩票台-| www.753964.com-搜狗彩票官网| www.836552.com-福彩3d体彩中奖号| www.901417.com-贵州一分快三软件| www.958438.com-今晚七星彩直播现场| 彩神购彩www.csgc4.com| www.be67.com-北京快三走试图| www.rh86.com-北京快三结果结果| www.15il.com-517菠菜网彩票| www.91nx.com-凤翔彩票正规吗| www.2147.vip-22彩下载-| www.7306.cn-彩虹六号手游下载| www.21186.com-福利彩票八卦图手册| www.60280.com-爱彩乐走势手机版| www.051113.com-彩知-| www.127457.com-网彩违法-| www.196581.com-百宝彩票-| www.262317.com-3d彩票天天开奖| www.362086.com-新加坡十分彩是什么| www.440208.com-山东彩票群英会查询| www.524012.com-win007彩票| www.618702.com-打彩票输了-| www.680400.com-ok彩票app-| www.747797.com-广州好彩丨开奖| www.809482.com-京彩娱乐网址| www.874517.com-大乐透彩票中奖查询| www.983175.com-盈彩吧双色球| www.ds72.com-快三公式预算法| www.te82.com-玩快三能中大奖吗| www.4dn.cc-彩票加盟代理多少钱| www.54ry.com-xy773幸运彩票| www.715.red-私彩非法经营| www.4020.in-香港博彩11码| www.8924.com-彩乐乐网公告| www.70658.com-彩票中奖全图查询| www.026562.com-辉煌彩票网址| www.095889.com-竞彩体彩群-| www.151508.com-中彩网用户注册| www.250399.com-全中彩票官网下載| www.312508.com-七乐彩直播开奖| www.369902.com-彩票机造假视频| www.451502.com-澳门幸运分分彩|