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天

知道了
畅彩 www.892058.com-时彩彩助手-| www.53228.com-时时彩流水-| www.312069.com-湖南福彩福彩天地| www.994016.com-3d彩票怎么打| www.734059.com-双色球凤彩字谜| www.790207.com-炫彩材料-| www.zr52.com-彩96计划-| www.hv19.com-快三投注网-| www.083108.com-中彩手彩票下载安装| www.964391.com-全国福彩体彩开奖| www.943358.com-网易彩票买不了| www.672210.com-足彩彩票预测下载| www.940319.com-老时时采彩开奖记录| www.cp860.com-福彩快三网上投注站| www.032777.com-500彩票没邀请码| www.708113.com-网上彩票诈骗| www.200594.com-上海体彩11选5| www.288329.com-爱乐彩11选五辽宁| www.365270.com-广西快三有几种吗| www.38223.com-禁止出售彩票| www.025577.com-2元彩票网排列五| www.089888.cc-体育彩票七位数唯一| www.360415.com-龙岩彩民中双色球| www.487011.com-足彩派奖日期| www.562992.com-体彩前三直开奖结果| www.633881.com-博创彩票网址官网| www.727371.com-96彩票app-| www.801833.com-福彩3d大花猫途| www.876014.cc-11选5大彩鲸| www.955115.com-彩票是不是内部作弊| 幸运彩票www.339189.com| www.017774.com-正规手机彩票投注| www.109955.com-地下六仺彩app| www.274681.com-分分彩高手玩法| www.377126.com-49i彩票网-| www.494307.com-速8彩票是干嘛的| www.573961.com-爱乐彩篮球比分直播| www.662068.com-中福时时彩预测软件| www.753037.com-彩天下5334cc| www.844437.com-石家庄彩票弃奖| www.927234.com-老梁揭秘彩票完整版| www.989219.com-中彩票缴税标准| www.am17.cc-江苏快三购彩时间| www.539707.com-苹果版彩票计划软件| www.838602.com-丹麦28彩票技巧| www.933147.com-彩票省内都可以兑奖| www.990341.com-多乐彩网站-| www.ha7.cc-彩报-| www.oi79.com-青海时时彩走势图| www.x13.org-赚彩票-| www.197030.com-经彩网排列三走势图| www.313882.com-幸运彩票怎么破解| www.425900.cc-赢彩彩票软件| www.545608.com-app-5星彩-| www.884714.com-鳄鱼网彩票-| www.736793.com-建行彩票短信购买| www.692230.com-瑞诚彩票合买平台| www.784039.com-360彩票走势图全| www.897212.com-18年3d彩票谜语| www.976946.com-彩礼超过两万| www.dv04.com-f96福彩网app| www.c47.bid-福彩三d字迷汇总| www.535294.com-十二生肖的彩票开奖| www.9990.vip-进口彩妆代理| www.wm5.cc-彩票开奖走势图大全| www.198777.com-彩票玩法介绍大全| www.876122.com-体育彩票5排| www.aj99.com-七星彩秘诀-| www.449646.com-竞彩十四场-| www.526699.com-时时彩追号绝招| www.27450.com-手机彩票软件破解器| www.672019.com-福彩三d双彩字谜| www.805615.com-分分彩输了很多钱| www.46400.com-南京竞彩快三走势图| www.088946.com-爱乐彩河北11选五| www.798165.com-十一运夺金彩乐乐| www.912611.com-幸运彩福彩手机网| 亿发彩票www.802633.com| www.036317.com-彩票自动提醒| www.818450.com-500彩票一分赛车| www.128980.com-体彩扑克开奖| www.263001.com-彩票微信号大全| www.zv01.com-智能彩票摇号器| www.687032.com-中彩天下彩449| www.880418.com-买什么彩稳赚不赔| www.998014.com-快发彩票线路| www.xv17.com-好想中彩票-| www.79io.com-福彩双彩网论坛| www.7648.cm-澳门五分彩走势图| www.062475.com-59彩票平台-| www.84tt.com-利用彩票平台挣钱| www.344732.com-506彩票下载| www.543655.com-福彩3d水果图| www.826061.com-今日福利彩票中奖号| www.tc08.cc-成语彩票网名| www.96hd.com-鸿彩灯光维修| www.6703.cm-分分彩厘模式| www.173871.com-新快三游戏-| www.654321.cc-彩之源-彩种| www.556911.com-彩票得奖是否真实性| www.702108.com-体彩足彩竞猜14| www.848496.com-加州时时彩走势图| www.954842.com-瑞彩祥云下载网址| www.cr4.cc-玩快三方法-| www.j38.net-七星彩开奖号码公告| www.65xv.com-篮彩竞猜技巧| www.254725.com-一分彩开奖-| www.330086.com-3d牛彩网-| www.785545.com-皇都彩票平台提款| www.853382.com-体育彩票春节停售| www.905172.com-合肥体彩店能转让吗| www.960117.com-彩票平台推荐一下| 福利彩票www.99677g.com| www.599181.com-易彩乐骗局-| www.686833.cc-彩票中奖新闻最新| www.762950.com-全民足彩网-| www.828393.com-数字彩怎么玩| www.884849.com-买彩票技巧公式| www.947515.com-外围足彩网站| www.987387.com-6234天天彩票| www.cf9.cc-广东好彩1-| www.061063.com-天天爱彩票无法提现| www.730342.com-易彩趋势-| www.793009.com-安阳彩民-| www.860157.com-时时中彩票登录| www.911177.com-k彩手机彩民福地| www.964669.com-竞彩管房网比分直播| 爱彩乐www.347918.com| 旺旺彩票www.764499.com| www.4545.hk-开七星彩号码| www.870386.com-类似印象彩票的网站| www.7zp.com-婚后一方中彩票| www.cai3234.com湖北快三走势图表| www.091514.com-703彩票网苹果版| www.258913.com-竞彩交易-| www.0994.net-q彩网计划群| www.025979.com-一定牛甘肃福彩快三| www.165640.com-168彩票老版本| www.789461.com-中国竞彩网手机下载| www.500789.com-一寸彩色近照| www.650328.com-网上博彩骗局有哪些| www.850727.com-时时彩是有规律的| www.6214.cc-百度3d家彩网| www.07173.com-中国福利彩购买软件| www.006652.com-北京5分彩计划| www.135527.com-一分钟一开奖的快三| www.233474.com-福彩快三大家输多少| www.4830.cn-彩16官方免费下载| www.08012.com-全国彩票最大奖| www.215098.com-彩种是什么意思| www.285367.com-湖北快三历史跨度| www.090081.com-影吧彩票-| www.88935.cc-天空彩票手机看开奖| www.228866.com-江苏彩票11选5| www.044485.com-海南七星彩专家杀号| 凤凰彩票www.3479j.com| www.888228.com-乐彩合买是骗局| www.991302.com-金彩网彩富网高手网| www.fc52.com-玩彩票有赢的吗| www.b89.com-福彩三地天齐网| www.41lw.com-鸿运彩票怎么提现| www.92577.cc-体育彩票一定牛| www.071988.com-竞彩亚盘什么意思| www.132499.com-豪彩娱乐注册|