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.384175.com-爬取彩票预测数据| www.11qp.com-天彩-| www.60526.com-豪彩计划软件| www.359880.com-体彩导报在线阅读| www.581187.com-怎么看福彩走势图| www.076109.com-彩票达-| www.186060.com-快三挂-| www.269476.com-新彩彩票是骗局吗| www.1322.vip-黄金8彩票网真实吗| www.478784.com-竞彩2c1对冲方法| www.390983.com-怎么可以中彩票方法| www.0155.org-有彩色-| www.290829.com-内蒙古快三转家预测| www.846438.com-体彩福彩合并申请书| www.388443.com-摇骰子彩票天天乐| www.521953.com-中国彩官网下载| www.89873.cc-福彩三地预测号码| www.302590.com-澳门官网彩票| www.95ft.com-博彩相亲骗局| www.21823.cc-注册送28彩金| www.874475.com-老谢说彩双色球定位| www.cai4044.com安微省快三开奖结果| www.965414.com-福利彩票预测总汇| www.cp3391.com-现在内蒙快三走势图| www.813925.com-安徽福彩一定牛| www.970430.com-启航导师赚钱彩票| www.cp2077.com-分分快三技巧规律| www.58763.cc-怎么办福彩积分卡| www.365077.com-2015版彩库宝典| www.974500.com-大星彩票网址| www.12kg.com-天天爱彩票ios版| www.515777.com-彩的陪首-| www.672239.com-826.cc彩票网| www.766504.com-彩票每天稳定盈利| www.937556.com-福彩快3安徽| www.996403.com-哈尔滨福利彩票中心| www.fh04.com-湖北快三遗漏一定牛| www.930114.com-3d彩票玩法技巧| www.200487.com-彩票预测-| www.285761.com-31c彩票-| www.42fq.com-彩票开奖哪里直播| www.916.net-摇一摇机选七星彩| www.660902.com-彩票引流方案| www.658512.com-百宝彩用户名| www.711772.com-时时彩高手杀号技巧| www.999394.com-彩票能在手机上买吗| www.122599.com-怎么找刷彩金的平台| www.316325.com-乐彩论坛静态版| www.fn47.com-今天江苏快三结果| www.2822.site-k彩游戏下载安装| www.943389.com-重庆时彩下注平台彩| www.96em.com-博亚彩票app下载| www.15281.cc-谁有吉林快三群| www.002400.com-杭州彩票分析师招聘| www.232338.com-好彩网论坛3d图谜| www.965954.com-五分快三投注技巧| www.567.tv-05oo彩票零售版| www.62782.com-明天彩票开奖结号码| www.173769.com-6e彩票-| www.247116.com-买彩票赚钱的方法| www.369324.com-众易彩票送彩金| www.594014.com-汇彩国际彩票| www.905057.com-卖足彩料合法吗| www.056063.com-彩票大本营生肖表| www.128142.com-快三共享走势图下载| www.699580.com-上海福彩双色球开奖| www.px39.com-彩票app有红包的| www.291037.com-找回365彩票| www.838451.com-丹麦28是私彩吗| 易彩网www.12455g.com| www.n69.top-体彩7星彩开奖走势| www.7789.vip-法贝热彩蛋不见的| www.89280.com-凤凰微彩-| www.308327.com-彩票投注站网上缴费| www.6909.cm-七彩印象-| www.248544.com-购彩软件哪个好用| www.ll7.cc-手机玩快三咋玩| www.ts37.com-快三app送彩金| www.163749.com-中华彩票安卓版下载| www.4560.in-福利彩票19035| www.52572.com-好彩粤语-| www.028217.com-奔驰彩票是合法的吗| www.350399.com-深圳神彩uv打印机| www.492255.com-彩票试玩账号兼职| www.39785.cc-中福彩票软件下载| www.254722.com-正规足球竞彩app| 新盈彩www.xinyc5.com| www.295886.com-快速查彩票开奖结果| www.036595.com-竞彩足球历史开奖| www.293663.com-正规的彩票网站制作| www.509282.com-万城彩票真假| www.728377.com-鸿彩网娱乐是诈骗么| www.962458.com-福彩中心1360亿| www.1xp.com-手机彩膜diy| www.5497.vip-怎么开网络彩票店| www.005438.com-今天的福彩三d报纸| www.114430.com-大发彩票官方网站| www.338470.com-天易彩票下载| www.474047.com-国家福利彩票| www.661722.com-足彩中10亿给钱吗| www.848175.com-福彩3d一注多少钱| www.cai9544.com精彩十分中奖奖金| www.qs15.com-体彩中心工资高吗| www.80gk.com-卡尔达诺公式算彩票| www.5946.com-体彩杀号定胆天齐网| www.46603.com-彩票可以发财| www.132106.com-惠安彩礼-| www.347401.com-台湾褔星彩平码资料| www.492398.com-乐彩客彩票akp| www.03hk.com-彩票冷热遗漏怎么看| www.0521.pw-时时彩婚恋骗局花篮| www.625804.com-天天爱彩票客服电话| www.631921.com-七彩云南全国分店| www.088885.com-福彩35好运彩开奖| www.074518.com-金彩网下载-| www.hx57.com-体彩e球彩中奖规则| www.5792.biz-竞彩过关方式2×1| www.398166.com-七星彩2276期测| www.mr51.com-彩票快三是正规的吗| www.25120.com-彩铅桃花树-| www.388569.cc-彩友会是不是真的| www.596925.com-zc5.com尊彩| www.489413.com-三星彩票娱乐漏洞| www.856543.com-福利彩票书籍| www.tl55.com-28彩票官方网站| www.6744.cm-彩票销量2017| 汇彩网www.hc3656.com| www.356123.com-体彩泳坛夺金| www.508469.com-彩票如何及时止损| www.767870.com-旺彩全国开奖大全| www.42405.com-709手机版彩票| www.108302.com-彩票差点中奖的心态| www.060012.com-体彩云南十一选五| www.119929.com-福利彩票几排数| www.288912.com-彩票开奖查询123| www.509538.com-第九彩票注册| www.36355.cc-体彩走势图有用吗| www.065609.com-许巍彩虹吉他谱| www.164820.com-彩票试机号3d| www.555076.com-江西结婚彩礼| www.055729.com-我要买彩票双色球| www.063456.com-中国体彩加盟| www.32363.cc-彩色包装袋印刷| www.557629.com-好运彩票网登录| www.689646.com-网络彩票回血| www.068107.com-彩票gg挂机-| www.174418.com-快三哪个省最火| www.285186.com-和值彩票规律| www.393972.com-彩库宝典全年资料| www.599848.com-大家都买什么彩票| www.789523.com-彩色包装箱厂| www.923077.com-乐透彩3d字谜大全| www.791546.com-京东彩票安全吗| www.al0.cc-天津体彩11选五| www.hc40.com-鼎盛彩运8团队| www.33610.com-适合新手的彩票| www.078043.com-五分彩倍投骗局| www.ek89.com-贵州省体彩网| www.2313.org-港版好彩香烟价格| www.437605.com-星彩娱乐骗局| www.09wj.com-福彩什么时候封盘| www.v11.org-买时时彩的app| www.5804.cm-竞彩3串2几场容错| www.26mp.com-杨哥说彩3d预测|