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.62315.cc-百博海南七星彩网址| www.829278.com-1888彩票平台| www.485705.com-腾讯手游彩票| www.052356.com-360购彩大厅首| www.449101.com-最专业高频彩种| www.505942.com-中国彩票引发的案件| www.822059.com-彩票双色球红球杀码| www.ih84.com-九龙坡区彩票| www.216342.com-五分快三计划平台| www.475959.com-体彩开奖结果2元网| www.603726.com-体彩专家杀码定胆| www.777270.com-ag彩数据下载| www.955385.com-凤凰彩票挂机软件| www.ib82.com-安徽福彩开奖结果| www.48hw.com-七星彩坐标-| www.162402.com-福彩3000期走势| www.893111.com-彩票预测缩水软件| www.937838.com-彩票软件时时彩送| www.b65.net-5分彩全天计划| www.017708.com-广东省福利彩票中心| www.838395.com-江苏快三大奖| www.966326.com-网络兼职福利彩票| www.101346.com-网络中彩网-| www.257235.com-快三客开奖app| www.566522.com-香港÷和彩-| www.671207.com-彩易网开奖公告| www.774028.com-澳门博彩业-| 亚投彩票www.ya488.com| www.009562.com-时时采彩老走势图| www.103736.com-乐彩网余款可以提现| www.246447.com-3d彩宝-| www.64nr.com-现在微信哪买彩票嘛| www.987939.com-仲彩娱乐登录| www.ga13.com-天天彩票是不是诈骗| www.73518.com-8816彩票app| www.928005.com-快三预测湖北肖立刚| 500彩票www.684077.com| www.51ju.com-足彩大富翁手机版| www.751927.com-导航体育彩票| www.887632.com-十一选五彩票能买吗| www.998124.com-七星彩解诗网粤| www.fx15.com-探探男带玩彩票| www.yn23.com-彩票双色球购买日期| www.814544.com-彩票游戏开元棋牌| www.970089.com-网上购彩最好平台| www.md25.com-中彩网官网首页| www.65xi.com-现在买彩票的人多吗| www.994010.com-彩票足球竞彩怎么玩| www.gg92.com-彩虹哥-| www.q77.shop-双阳黑彩小哈| www.271215.com-8亿彩在线下载| www.70918.com-验证码送彩金| www.9701.vip-彩票刮刮乐促销方案| www.452483.com-重庆福彩快乐十分| www.600087.com-黑龙江鸡西彩票中奖| www.42qs.com-阳光彩票-| www.1980.pro-足彩二串一实战技巧| www.0cp.cc-彩票大奖中奖故事| www.785051.com-七星彩日历直码| www.914343.com-网上时时彩赌博骗局| www.989881.com-彩吧助手开奖公告| www.wx4.com-搜索快三助手| www.qi38.com-今晚好彩1开奖结果| www.168664.com-时时彩开奖结果| www.30303.com-3d南方双彩-| www.13820.cc-新浪爱彩投注| www.82dl.com-大乐透预测牛彩网| www.gi44.com-官方有三分快三| www.070035.com-甘肃体彩开奖| www.719811.com-竞彩篮球玩法介绍| www.864824.com-彩膜怎么贴-| www.936951.com-今晚体彩奖号| 网易彩票www.36788c.com| www.ib75.com-内蒙福彩快三一定牛| www.227227.com-体彩开奖结结果| www.223716.com-竞彩足球开奖结果| www.306776.com-天津福彩中心地址| www.036029.com-熊猫时时彩qq群发| www.151898.com-体彩排列三今日推荐| www.125869.com-体育彩票赚钱吗| www.147399.com-竞彩大小球怎么看| www.247335.com-彩富网香港官方| www.993522.com-足彩玩法详细介绍| www.ka67.com-福彩江西快3玩法| www.731246.com-五州彩票-| www.797105.com-凤凰2彩票-| www.866891.com-南京市体彩兑奖| www.920467.com-双彩网论-| www.973477.com-彩虹宝宝角色名字| www.cai131.com-武汉快三开奖| www.524908.com-彩票各两大平台互刷| www.646995.com-胜负彩心得-| www.734401.com-凤彩网3d胆码| www.799178.com-奔驰彩票快八| www.866594.com-怎么玩快三能赢| www.923385.com-好彩彩票下载| www.982711.com-67彩票平台-| www.mg1.cc-安徽快三输死了| www.oe57.com-彩票平台送彩金| www.25569.cc-第17004期体彩| www.096331.com-牛彩专家-| www.43857.com-好彩网摘彩网| www.770455.com-快三杀大赔小| www.976279.com-因为彩礼分-| www.rb14.com-贵州快三开奖今天| www.980612.com-好牛彩票-| www.cai3909.com快三彩票计划骗局| www.hb12.com-购彩大厅手机版下载| www.05mj.com-体彩排列三号码遗漏| www.0014.cc-十二生肖的彩票开奖| www.762591.com-世界最高彩票奖| www.840506.com-彩妆店中岛装修图片| www.842005.com-聚鑫彩票是真是假| www.937251.com-易彩集团ap-| www.731137.com-体彩店的布置图| www.793078.com-邢台体彩中心| www.6000.cm-足彩40期-| www.853428.com-时时彩怎么都是输| www.796882.com-网络黑彩怎么举报| www.921324.com-彩神争霸8官方下载| www.981629.com-买彩票下载什么软件| www.2yi.com-靠谱的黑彩平台| www.68ez.com-竞彩258球迷官网| www.3659.me-彩票网站投诉| www.8924.com-彩乐乐网公告| www.688788.com-鸿鼎彩票注册| www.839324.com-足彩胜负彩分析| www.967954.com-彩友多微信群| www.ff97.cc-体育彩票十分钟开奖| www.94.cc-澳门十分彩计划| www.dq96.com-快三省份-| www.8497.vip-金龙彩-| www.097.tv-彩神心水-| www.495350.com-做个博彩平台要什么| www.579563.com-3d王朝彩票论坛| www.688192.com-广东电脑福利彩票| www.812600.com-有关福彩3d的书籍| www.907308.com-天津快三怎么玩| www.997494.com-浩博时时彩源码| www.me45.com-福建快三号码预测| www.00mq.com-银猫彩票-| www.099742.com-佰盈彩票合法吗| www.2300.cc-微购彩下载-| www.07wg.com-彩铅鲜红配色| www.404368.com-马家窑彩陶王| 吉利彩票www.80075i.com| www.ip64.com-体彩官网-| www.zq55.cc-彩票怎么样算中奖| www.629071.com-快三点数怎么买| www.2072.cn-彩票漏洞赚佣金| www.05733.com-足彩手机14下载| www.954053.com-大发快三邀请码注册| www.271844.com-博牛彩票登录| www.761548.com-1分快三计划群| www.813512.com-彩票线报网-| www.873706.com-彩57-| www.922344.com-足彩培训师怎么考| www.968874.com-全民快三乐彩| www.gl9.com-安徽快三走势| www.kp52.com-江苏福利彩票双色球| www.9281.loan-福乐彩票欺骗| www.160258.com-神舟彩票下载| www.515579.com-七星彩中奖历史最高| www.8hf.com-破译彩票软件下载|