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天

知道了
9彩注册 www.088529.com-彩票盈利的方法| www.cg22.com-买彩票app-| www.t67.top-app118彩票-| www.132336.com-彩礼相关法律| www.65037.com-710竞彩平台骗局| www.ks76.com-大发快三国家承认吗| www.cp7553.com-北京快三预测一定牛| www.887045.com-九龙彩票投注平台| www.738304.com-带玩彩票qq群号| www.fr71.com-百盈快三计划网| www.17dq.com-福彩天地3d-| www.2431.xyz-讨个好彩头什么意思| www.892957.com-彩票内蒙古11选五| www.107784.com-买彩票怎么开讲| www.8953.xyz-上海福彩天天选三| www.0773.cn-苹果app送彩金| www.036.hk-唐龙天天彩-| www.913388.com-彩客网即使比分| www.981003.com-怎样用彩折做冰淇淋| www.fu9.cc-福彩时时彩开奖结果| www.841815.com-福利彩票最近| www.nq03.com-福彩双色球自选号| www.j30.cn-注册免费彩金| www.344409.com-山东彩票群英会下载| www.559732.com-彩宝的宣传语| www.768637.com-天猫彩票网站| www.898413.com-福利彩票去哪里查| www.cp163.cc-贵州福彩助残| www.144159.com-老时时彩图感觉| www.290233.com-今晚开七星彩奖结果| www.390575.com-分分彩8码稳赢| www.535769.com-有11位的彩票吗| www.622087.com-彩票澳门快三怎么玩| www.677478.com-8k彩票平台-| www.768163.com-高频彩赚钱大低| www.846999.com-福彩对投注站的条例| www.2243.in-时时彩经验-| www.53733.com-向日葵时时彩| www.091891.com-百姓彩票网打不开| www.107031.com-093彩票下载软件| www.348945.com-合肥开彩票店多少钱| www.539165.com-哪里有彩票店转让| www.823295.com-佳乐金街附近福彩店| www.967759.com-福利彩票结果查询| www.un06.com-分分快3是什么彩票| www.5182.me-足彩预测推荐号码| www.789581.com-竞彩赌博-| www.86623.cc-福彩动物总动员玩法| www.093383.com-北京体彩店-| www.173663.com-江苏快三开奖走势| www.38381.com-云彩店靠谱吗| www.48gv.com-吋时彩今天开奖结果| www.1862.com-官方网人人中彩票| www.8308.hk-大彩电-| www.281335.com-海口五星彩票| www.461230.com-国家彩票官方网站| www.024794.com-景德镇体彩中心| www.543.net-广州好易终端彩票| www.24200.cc-中国福利彩票假| www.0063.cc-买彩票哪种好中奖| www.114904.com-富贵彩软件-| www.06ee.com-油性彩铅品牌| www.80kh.com-金誉彩票网封了吗| www.1942.com-派彩网河南快3| www.44700.com-福彩能买吗-| www.333383.com-玩彩合买-| www.542666.com-来彩020官网| www.320850.com-中彩乐群英会app| www.980497.com-赌彩票一分钟开一次| www.hn16.com-足彩十四场对阵表| www.75ov.com-10选一彩票开奖| www.335930.com-体育彩票可以网上买| www.556287.com-福彩3开机号| www.719623.com-河北快彩快三电子图| www.cp1000.com-幸运快三人工计划网| www.840870.com-黔西南福彩中心地址| www.934525.com-福利彩票软件有哪些| www.993466.com-足彩单固一直买平| www.ch06.com-快三赔投方法| www.sb84.com-福彩快乐12走势图| www.06nl.com-兰州福彩一等奖| www.702550.com-绵阳盛澳竞彩联盟| www.820582.com-山东省彩钢瓦厂家| www.958980.com-万众彩江苏快三单双| www.sb56.com-彩票大数据分析软件| www.970729.com-高频彩票漏洞套利| www.573989.com-中信积分赢彩| www.677741.com-各种彩票开奖查询| www.838252.com-105彩票.com| www.cp889.cc-百姓彩票官方网站| www.505144.com-哪些彩票网有送彩金| www.612050.com-福利彩票站点缴费| www.bd93.com-内蒙古体彩兑奖地址| www.44bd.com-好彩一综合走势图| www.4629.biz-彩票真的假的| www.57188.com-下载锋彩直播| www.669848.com-体彩有几个数字| www.162817.com-湖南福彩动物总动| www.118896.com-福利彩票预测总汇| www.k68.me-上海快三手机版| www.95zw.com-彩之堂赚得多吗| www.05593.com-义乌市体育彩票征召| www.871684.com-利彩彩票版下载安装| www.4476.vip-彩虹岛高手视频| www.73573.com-福彩字谜总汇大全| www.xm39.com-今晚大乐透彩票号| www.26yd.com-北京加盟彩票站| www.0803.cc-欧冠冠军彩票哪里买| www.701100.com-彩票通cpt资讯版| www.793923.com-福彩不算赌博吗| www.868809.com-快三规则,中奖概率| www.823758.com-双色球体彩-| www.2488.bid-体育彩票虚拟e球彩| www.oq90.com-万优彩票-| www.94hw.com-中i国彩吧-| www.757206.com-中国体育彩票高频彩| www.860924.com-今天七乐彩开奖号码| www.940342.com-内蒙快三杀号定胆| www.ew07.com-中彩手彩票官方网站| www.zl12.com-福彩快三挣钱吗| www.057428.com-彩票双色球出啥数字| www.388855.cc-体彩手机在线正规吗| www.8233.cc-莱利彩票网-| www.0385.xyz-迪士尼彩乐园网址| www.669.vip-金凤凰时时彩平台| www.09285.com-彩票39下载-| www.610234.com-如何用淘宝买彩票| www.826582.com-体彩排列三谜语| www.902318.com-在黑彩打工是犯罪吗| www.974487.com-四川体彩官网首页| www.04ej.com-彩票入门-| www.7408.pw-色彩静物临摹| www.360584.com-长春体彩怎么领奖| 虹彩集团www.011888aa.com| www.552927.com-老挝时时彩诈骗| www.698004.com-浙江体彩20-| www.587233.com-湖北宜昌快三走势| www.25018.com-广东省体彩兑奖地址| www.120758.com-即时开彩手机软件| www.040390.com-体彩天下犯法| www.8029.vip-十字彩是个什么东西| www.8964.me-预言家专业彩票计划| www.919323.com-免费搭建彩票| www.822055.com-福彩3d奖金设置| www.650204.com-十字彩什么意思| www.809535.com-彩票店对联图片大全| www.723073.com-常州体彩1800万| www.832091.com-977时时彩-| www.87916.com-幸运彩票腾讯三分彩| www.009216.com-彩票33苹果版下载| www.071262.com-竞彩网招聘-| www.294918.com-约约彩票下载安装| www.356151.com-分分彩自动挂机稳赚| www.403883.com-7星彩预测总汇| www.14zn.com-幸运彩qq群-| www.502862.com-福利彩票站怎么提点| www.624036.com-足球彩票单场玩法| www.789412.com-彩色耐磨地坪| www.853562.com-彩票头条是什么| www.cai1655.com北京快三开奖结果走| www.283.website民权彩礼多少钱| www.304477.com-河北快三连线走势图| www.9940.biz-全国各省彩礼排行榜| www.775065.com-彩票快3的规律|