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.339076.com-21个号彩票-| www.947583.com-彩票诈骗网站流程| www.037809.com-49彩票com-| www.829897.com-网易福彩杀号定胆| www.fu89.com-彩票快三-| www.209333.com-快三代理怎么拉人| www.886249.com-博彩推广手段| www.050453.com-有没有黑彩链接| www.913677.com-快三提现-| www.374056.com-体彩手机账户注销| www.589887.com-七星彩局王图纸| www.677990.com-意彩足球比分直播| www.779272.com-彩赢助手软件下载| www.887537.com-最新的下彩网网址| www.979827.com-恒大彩票app下载| www.eh02.com-福建体彩兑奖地点| www.w33.online-期期有好彩-| www.31670.com-竞彩足球胜负14| www.222941.com-中国体育彩票网| www.763297.com-网站彩票做庄| www.960115.com-彩票送28元体验金| www.4ig.com-07彩票是正现的吗| www.510220.com-彩虹的约定儿歌试听| www.970231.com-安卓彩神通app| www.cp45.cc-内蒙福彩快三走势图| www.nv28.com-为什么体彩不算赌博| www.07bi.com-美丽夜空彩铅画| www.85iz.com-福彩3d胖哥说彩| www.2623.wang-娜彩快开是真的吗| www.312233.com-下载乐彩彩票| www.508340.com-买彩票禁忌-| www.1521.online赤峰体彩中心电话| www.ja93.com-足球竞彩网站| www.2854.biz-地下黑彩量刑标准| www.365386.cc-福彩4码遗漏| www.520659.com-澳洲3分彩官方网站| www.97qw.com-体彩飞鱼开奖结果| www.oe13.com-快三猜一个号技巧| www.2542.vip-自己玩黑彩算犯法吗| www.888897.com-怎么推广彩站宝| www.087714.com-梦见彩票号码| www.223685.com-一分快三计算公式| www.706141.com-约彩365官网| www.788216.com-中国足彩网专业服务| www.868697.com-dd彩骗局-| www.936207.com-5星彩票app-| www.983843.com-广东福彩快十走势图| www.ed9.com-中彩网官网-| www.734401.com-凤彩网3d胆码| www.834754.com-26期福彩开彩结果| www.25836.com-彩图宝典下载安装| www.225447.com-英国五分彩开奖| www.318199.com-彩计划下载v2·0| www.451265.com-c彩16官网下载| www.566044.com-599易彩堂-| www.680063.com-好彩票专业版安卓| www.792523.com-附近彩票店在哪里| www.870771.com-中博彩票开奖网站| www.au6.com-吉林快三输钱| www.660479.com-中国彩票排列五| www.766719.com-网友教我玩彩票| www.560942.cc-安徽快三和值图表| www.678142.com-发财体彩店app| www.751147.com-彩票巴士是真的吗| www.812126.com-福彩3d人工计划群| www.882415.com-易彩堂可靠吗| www.fa47.com-海南七星彩专家预测| www.42641.com-5号彩票下载安装| www.031314.com-天天购彩网是真是假| www.117828.com-分分彩票技巧| www.195437.com-福彩三地基本走势图| www.004005.com-快乐十分彩票app| www.129510.com-中奖彩票软件下载| www.285865.com-福彩迷江苏快3| www.791706.com-宁夏快三玩法| 财神网www.29277g.com| www.855650.com-各种釉彩大瓶作文| www.979118.com-好彩烟看真假| www.mh60.com-好彩网靠谱吗| www.843556.com-福彩公益语-| www.947819.com-福建快三实时开奖| 幸运彩票网www.33598x.com| www.kz43.com-澳博彩票app| www.i13.com-福彩3d坑人吗| www.53fz.com-3d之家彩网-| www.455080.com-金冠彩票app下| www.190494.com-e球彩实时开奖结果| www.679712.com-巨龙彩票下载| www.808688.cc-天玺彩票注册| www.881532.com-电竞博彩有哪些网站| www.954311.com-苹果版本时时彩软件| 博亿彩票www.636by.com| www.eq50.com-快三秒奶茶店加盟| www.uw33.com-有没有玩快三赢钱的| www.493110.com-彩票粉有毒吗| www.128143.com-彩票不能折-| www.496959.com-开开彩乐-| www.788.space-复式彩票概率| www.501561.com-福彩双色球选几个号| www.529651.com-好彩网是不是骗人的| www.610378.com-辽宁彩票12彩| www.103047.com-好彩先锋最新资料报| www.218976.com-众彩易购下载安装| www.9119.love-摇一摇七乐彩机选号| www.359792.com-网上竞彩彩票app| www.0813.bid-网上足彩购买方法| www.353931.com-六给彩票直播| www.440480.com-幸运彩票网址是什么| www.535989.com-40万买彩票没中| www.620026.cc-中彩岛国片-| www.691583.com-中华彩票公益时报| www.760059.com-看时时彩走势app| www.964174.com-彩经网杀号-| www.3ss.com-福彩106期点彩图| www.247.live-什么彩票5分钟开奖| www.892448.com-福彩缩水软件| www.605499.com-全国福体彩开奖查询| www.97aj.com-竟彩分析推荐| www.267044.com-苏州e球彩-| www.18122.com-福彩好彩天地报纸| www.72929.com-长沙彩票事件| www.056967.com-数字型彩票选号技巧| www.39503.com-七星彩好的号码推荐| www.301251.com-58彩票app-| www.370193.com-ee彩正规吗-| www.447343.com-买足彩稳胜技巧穿法| www.271499.com-广东500彩票网| www.384428.com-贴吧彩票吧-| www.32wq.com-网上彩票平台举报| www.622757.com-三彩服饰公司| www.160022.com-彩八彩票苹果版下载| www.225393.com-网上微信彩票诈骗群| www.173353.com-江苏省福彩快三开奖| www.250884.com-福彩快三和法吗| www.330077.com-国彩吧-| www.398695.com-彩票软件开发定制| www.529544.com-直播彩票软件| www.630309.com-彩吧3d第四版| www.697411.com-七星彩概率-| www.638.online-世界最大的彩票公司| www.73040.cc-福彩藏机诗-| www.771586.com-山东体育彩票扑克3| www.852224.com-体彩七位数中奖条件| www.m34.me-凤彩网双色球预测| www.55ae.com-丰大彩票是真的吗| www.444902.com-ai足彩软件-| www.261079.com-快三守号技巧| 500彩票网www.611306.com| www.rg35.com-168彩真假-| www.337089.com-湖北快三分布| www.222354.com-团队彩票计划| www.350568.com-冠军彩票app下载| www.298300.com-今晚七星彩开奖| www.397749.com-湛江七星彩论坛| www.5632.pw-安徽天福彩票机| www.169028.com-新时时彩组六胆拖| www.895455.com-乐彩网三d走势图| www.950387.com-105彩票网安全不| 趣彩网www.qucw3.com| www.258609.com-首页中国竞彩网| www.368856.com-login彩票坊| www.642743.com-上海体彩11-| www.738563.com-黑彩被骗报警管用么| www.855299.com-菲律宾彩票网上投注|