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.245566.com-福彩网1分快3计划| www.387383.com-手机彩膜素材| www.974624.com-七星彩头尾定位| www.jr2.com-河南快三今日遗漏| www.zc18.com-甘肃福彩体彩年度| www.244347.com-福彩走势-| www.969627.com-乐乐彩app下载| www.fw67.com-内蒙古快三预测号| www.04qn.com-水溶彩铅上色技巧| www.mf1.com-广西福彩快三助手| www.tn42.com-淘彩票大发快三规律| www.592118.com-独家七星彩小七靓码| www.786378.com-大赢家彩票开奖| www.893117.com-中国超级彩票助手| www.966770.com-彩票走努图首页| www.qc5.com-彩票精准预测专家| www.sb63.com-体彩e球彩总进球数| www.653769.com-500竞彩网直播| www.731864.com-做彩色纸箱的设备| www.811753.com-新家坡天天彩资讯网| www.890653.com-彩票平台刷返利教程| www.958300.com-浙江福彩快快乐| 8号彩票www.81520p.com| www.84998.com-民政部彩票发行| www.065235.com-如何举报彩票网站| www.137614.com-中国体彩有什么报纸| www.046907.com-黑龙江快三助手| www.7978.net-彩博会-| www.243530.com-快彩是国家正规的吗| www.269608.com-龙之彩彩票官网| www.5856.top-彩票店农历几号关门| www.139982.com-体育彩票查询结果| www.700780.com-快三反计划倍投| www.984424.com-福利彩票还可以买吗| www.gm60.com-河南快三必中技巧| www.65xw.com-中国体彩中心地址| www.340206.com-二分彩计划手机软件| www.72207.com-福利彩票复试怎么买| www.33811.com-手机快三怎么玩稳赚| www.cp3778.com-幸运快三是不是骗局| www.34yn.com-手机买彩票中奖算吗| www.2712.win-体彩知识-| www.243336.com-浙江彩票11选五| www.2146.org-天天中彩票无法提现| www.17631.cc-通过微信拉人玩竞彩| www.466147.com-彩票套利有几种方法| www.577297.com-快三要害死人的| www.649722.com-博彩堂什么电视剧| www.710162.com-什么叫套彩金| www.775094.com-快三彩票计划公式| www.3506.cc-彩票系统维护会怎样| www.17898.com-盛澳竞彩是不是传销| www.75659.com-亚搏足彩-| www.051038.com-彩票销售平台怎样做| www.156450.com-好彩堂一肖两码| www.631912.com-快频彩怎么玩| www.789184.com-足彩购买技巧方法| www.089033.com-内蒙快三出号规律| www.038281.com-七星彩查询中奖查询| www.030543.com-公彩合买软件| 500彩票www.26299v.com| www.924713.com-中国彩票第一大奖| www.4550.vip-重庆时彩时彩合买| www.68wv.com-出名的博彩公司| www.53563.com-怎么申请开彩票店| www.72414.com-易彩宝-| www.816021.com-福彩3d关公三字经| www.10xu.com-彩票快3手机下载| www.894733.com-优彩网官网登录| www.971774.com-创彩网兼职是真的吗| www.er2.com-快三复式中多少钱| www.160522.com-爱心彩票网站| www.203100.com-体彩走势图-| www.104900.com-缅甸好彩蓝莓双爆| www.206556.com-下载内蒙古快三助手| www.ib28.com-安徽省福彩兑奖中心| www.4qp.cc-怎么买才能中彩票| www.92ys.cc-什么是彩票代打| www.3914.com-竞彩单关只买平| www.760345.com-今天好彩3开奖结果| www.872114.com-云南体育彩票网| www.970615.com-彩票类型和玩法| www.i36.cn-福彩都是坑人的| www.5229.com-吉林快三那个时间开| www.5749.cm-体彩七位数造假| www.841.bid-二月八日彩票出什么| www.659331.com-七星彩中奖对比查询| www.766376.com-淘宝彩票客户端下载| www.837181.com-合肥体彩店找哪家好| www.893987.com-99彩票骗局-| www.952717.com-丰彩1元中奖规则| 500万彩票www.5441s.com| www.94487.com-河南福彩开奖结果查| www.619858.com-紫薇今日彩票占卜| www.531226.com-象棋彩霸周小平| www.339745.com-网上彩票免费送彩金| www.422941.com-泰国的彩票怎么查询| www.81ji.com-彩神通会员30群| www.907091.com-买彩票的幸运数字| www.985124.com-玩彩总是输-| www.lc3.com-e球彩玩法及奖金| www.pj53.cc-彩票经验-| www.30sj.com-彩虹玫瑰花语图片| www.28639.com-彩票和股票哪个害人| www.85218.cc-历届福彩主任是谁| www.a96.club-玩骰子的彩票| www.208269.com-福彩双色球快3玩法| www.359922.com-体彩断组胆码| www.089760.com-足彩胜负分析| www.152780.com-快乐彩票十二选五| www.7699.cc-九号彩票骗局| www.619421.com-彩票破了能兑奖吗| www.45087.com-福利彩票站提成| www.e79.top-彩票30选7-| www.948207.com-特彩吧琭场报码开奖| 亿万彩票www.345897.com| www.cai12.cc-北京快三-| www.gg12.cc-彩票双色球开奖号码| www.1888.cm-易记彩票-| www.9996.cc-福彩3d图库谜总汇| www.53249.com-时时彩前三组六杀号| www.gc9.com-彩票的规律-| www.a18.wang-新浪爱彩旧版| www.469708.com-网上买私彩严重吗| www.nf07.com-app彩票破解器| www.4872.net-福彩怎么算才能中奖| www.js07.com-王者彩票能提现吗| www.zm95.com-彩神vip-| www.65um.com-稳定的黑彩平台| www.538408.com-靠谱足彩app| www.015912.com-查看彩票开奖的软件| www.402188.com-乐购在线买彩票| www.509972.com-彩票中奖后兑奖流程| www.575514.com-旺彩四沟肖八码| www.426001.com-怎样玩竞彩足球挣钱| www.555273.com-乐讯吹吹七星彩圈| www.648819.com-网易彩票是-| www.708944.com-豪赢彩票app| www.782283.com-中福彩票平台| www.42020.com-彩票概率学公式| www.cai9211.com河北快三官网下载| www.6596.xyz-彩坛达人福彩杀五码| www.642678.com-3d走势图经彩网| www.1465.net-彩铅画视频古风美女| www.722.win-今日竞彩最温胆| www.6535.cm-凯发彩-| www.24349.com-超级彩票软件| www.5917.biz-江苏省福彩中心主任| www.393737.com-福彩3d奖结果r祸| www.330910.com-500彩票解码器| www.854404.com-竞彩篮球直播360| www.948159.com-福彩3d预测最准确| 500彩票www.51515h.com| www.th26.com-发彩网app平台| www.963163.com-竞彩网比分直| www.095187.com-小崔说彩票-| www.188232.com-甘肃快三助手免费| www.667519.com-诺基亚星际彩球游戏| www.775936.com-国民彩票平台登录| www.999179.com-e球彩包赢玩法| www.cm47.com-福利彩票快3好中吗| www.42fv.com-绍兴市体彩中心址| www.876952.com-合买体彩-| 亿万彩票www.345512.com|