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.591939.com-中国竟彩网胜平负| www.96503.com-台湾彩票有哪些种类| www.270921.com-下载7彩app-| www.4006.com-沙巴博彩公司官网| www.13ql.com-郑州福彩大厦| www.6850.vip-好彩薄荷爆珠多少钱| www.cg39.com-江苏快三合法平台| www.yb20.com-哪有买彩票的app| www.49cv.com-大家赢彩票网正规吗| www.2347.com-体彩排三基本走势图| www.108.pink-福彩双色球看奖结果| www.111507.com-盈彩网下载-| www.198330.com-大发彩票0234| www.998314.com-彩票天天乐是否正规| www.gx91.com-最新的彩票软件大全| www.8av.com-幸运彩票平台可靠吗| www.220673.com-彩神8合法吗| www.106792.com-私彩平台改单王| www.36xf.com-竞彩足球计算机器| www.2942.shop-五星体彩店-| www.503193.com-体彩任5开奖| www.139041.com-同城彩票网站| www.47486.com-延吉福利彩票站点| www.99701.com-彩客化学戈弋照片| www.073663.com-ba彩票平台-| www.13sa.com-排列三彩吧论坛首网| www.237664.com-精彩十分有几种玩法| www.3856.vip-竞彩资讯竞彩专家| www.025504.com-网络彩票能挣钱吗| www.183673.com-中国福彩官方客户端| www.561522.com-十分江苏快三技巧| www.711391.com-500w彩票网真假| www.38357.com-彩票优惠活动| www.062083.com-好彩客安全吗| www.176307.com-百盈快三的规律| www.282001.com-时时彩心得与技巧| www.375513.com-体彩开奖频道几台| www.524518.com-印尼五分彩骗局| www.590171.com-彩金项链多少钱一克| www.662901.com-天津福彩双色球开奖| www.430001.com-教水彩的软件| www.302419.com-七星彩综合走势图表| www.499766.com-彩票078-| www.598026.com-足彩十四场最快开奖| www.692112.com-彩票幸运选号彩乐乐| www.777880.com-体彩彩票是真的吗| www.884740.com-鳄鱼讲彩大乐透| www.959329.com-四大白菜彩票网| 500彩票www.330256.com| www.268318.com-彩涂铝板-| www.12wf.com-人人买彩票可靠吗| www.543.red-好易自助终端机彩票| www.37816.cc-禁止网络彩票| www.010131.com-淘宝彩票平台代理| www.qj80.com-今晚好彩1开什么号| www.270244.com-宫网567cc彩票| www.870047.com-体育彩票店几点关门| www.975328.com-时时彩怎么分析跨度| www.cp9777.cc-青海西宁快三下载| www.py90.com-彩票站打错号码案例| www.32bw.com-今天周日开什么彩票| www.838364.com-山东福彩彩友论坛| www.931895.com-彩票数字范围| www.990373.com-买彩票中大奖的数字| www.bo90.cc-易彩网在哪下载| www.275902.com-七乐彩复式中奖奖金| www.356828.com-黑龙江福彩36选7| www.443603.com-彩94-| www.552806.com-1号彩票网下载| www.27pv.com-男子捡彩票中奖| www.770965.com-彩票首页_欢迎您| www.872185.com-凯里福彩大奖| www.865159.com-福利彩票不是骗局| www.862916.com-七乐彩现场视频直播| www.980427.com-广西体彩电话投注| www.09qe.com-中福快三规则| www.151805.com-中福利彩票网站| www.688307.com-东莞体育彩票| www.74545.com-奥客赢家彩票| www.534044.com-奖虫七星彩网址| www.721962.com-118彩票网站| www.ty07.com-广东十一选五爱乐彩| www.fd98.com-红牛彩票app下载| www.60599.com-福利彩助手-| www.016163.com-下一个彩票开奖结果| www.089359.com-7168彩票苹果版| www.155643.com-微彩平台是合法的吗| www.231500.cc-佰万彩票邀请码| 大赢家彩票平台www.223075.com| www.5644.org-如何举报网络彩票| www.86126.cc-博兴彩钢瓦厂| www.219825.com-3d彩吧图库第二版| www.150707.com-微彩站合法吗| www.443799.com-今天彩吧3d第二版| www.865747.com-福彩试机号今天| www.954985.com-瑞彩祥云的幸运快三| 大玩家彩票www.84499w.com| www.100694.com-乐彩客苹果版怎么下| www.967072.com-网上如何买3d彩票| www.761285.com-体育彩票排三开机号| www.hp95.com-足彩开奖-| 500彩票www.50052hh.com| www.892989.com-最好的3d彩票软件| www.975427.com-江苏快三是怎么控制| www.ci28.com-吉林快三黑彩案例| www.su63.com-9彩彩票官网| www.4gu.com-彩票投注手是干嘛的| 快彩www.81678d.com| www.447823.com-分分彩五星计划网站| www.08737.com-今天3d彩民乐图库| www.739157.com-555彩票官网| www.949221.com-pc28高奖金彩票| www.596041.com-福豪彩是真的吗| www.011069.com-极速时时采彩网站| www.752316.com-网络彩票最新新闻| www.865908.com-深圳熊猫彩票| www.940722.com-彩票推广话术搞笑| www.5698.biz-伊布都和三彩哪个好| www.bk36.com-快三中奖图标| www.6789.net-77彩票手机版77| www.092410.com-福建即乐彩11选5| www.721669.com-破译彩票软件| www.61wv.com-安卓版38彩票| www.4694.vip-七彩虹c3-| www.22124.com-时时彩买数字技巧| www.670339.com-福利彩票3d太湖| www.941680.com-93彩票网-| 500彩票www.911070.com| www.sf77.cc-腾讯网彩票预测最准| www.677977.com-体彩怎么买足球彩票| www.752629.com-浙江快乐彩十二选5| www.852003.com-福利彩票可糊弄人| www.913108.com-我去彩票站-| www.965679.com-彩61破解-| QQ彩票www.89894n.com| www.04ky.com-彩铅人物脸-| www.44790.com-福利彩票利润| www.79298.com-体彩线上投注| www.390065.com-什么彩票能中几百万| www.646813.com-职业彩民年收入| www.30ca.com-天津时时彩正规吗| www.1474.vip-简笔画彩铅画风景图| www.9388.top-双色球彩票防伪标志| www.lg22.com-彩易科思app下载| www.589964.com-福彩三地和值表儿| www.89932.com-093彩票群-| www.171625.com-河北省福利彩票快三| www.29bq.com-眼睛手绘图片彩铅画| www.848816.com-皇家时时彩软件| www.899783.com-83彩票官网下载| www.579500.com-体彩排列预测结果| www.361044.com-万达时时彩是真的吗| www.456520.com-三分时时彩预测| www.362097.com-台湾乐透彩资料中心| www.724822.com-兼职彩票投注手| www.208258.com-快三开规则-| www.34945.com-永利彩世界app| www.183157.com-幸运快三官网app| www.566826.com-河南大乐透彩票中心| www.935756.com-刘大军彩票网站| www.cp373.com-快三平台靠什么赚钱| www.yk76.com-彩票书籍在线阅读| www.84yx.com-93彩票平台-| www.657988.com-新利彩票是真的吗|