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.4040.cm-香港赛马会彩票平台| www.90906.com-福彩平台刷水| www.138871.com-福彩端邀请码| www.286974.com-安徽快三中奖金额| www.43250.com-豪门汇彩票客服| www.3889.biz-福彩资料大全| www.11033.cc-篮球竞彩投注| www.80874.com-福彩排列7怎么买| www.133032.com-三分彩计划网页版| www.276259.com-大发快三没人举报吗| www.yh76.com-福利彩票几率计算器| www.977909.com-福利彩票3d写迷| www.060718.com-聚华体彩店安全么| www.15ui.com-蚂蚁娱乐彩注册| www.34960.com-百度乐彩网下载| www.051068.com-中国体育彩票网开奖| www.8655.biz-彩吧彩票单双大小号| www.af4.cc-全国快三形态走势图| www.295118.com-贵州快三下载官网| www.88350.com-龙之彩平台-| www.234968.com-3d彩票图谜-| www.466127.com-七乐彩开机号多少| www.613846.com-网上买彩票兑奖彩票| www.735961.com-彩虹宝宝玩具| www.374410.com-找个最可信的彩票网| www.513882.com-双彩球下期蓝球预测| www.808775.com-百度彩票吧-| www.447183.com-竞彩神兽单总进球| www.183893.com-河北体彩开奖| www.78733.cc-足彩开奖及奖金| www.967802.com-百合男骗时时彩| www.395319.com-彩虹岛游侠转职路线| www.zp72.com-手机时彩害人| www.sp74.com-七乐彩预测号码| www.384514.com-福利彩票的公益口号| www.eu51.com-北京5分彩官方数据| www.950398.com-8亿彩合法吗| www.47vh.com-3d走势图乐米彩票| www.948061.com-开体彩与福彩哪个好| www.cai903.cc-江苏快三的开奖结果| www.00538.com-今晚足彩比分直播| www.400503.com-如何查福彩站号查询| www.7813.com-竞彩足球经验| www.277466.cc-浙江怎么没有七星彩| www.577612.com-彩虹糖颜色视频| www.796406.com-上海体彩中心电话| www.cp224.com-一分快三计划软件| www.304.tv-潘攀彩票-| www.9995.date-福彩开奖号码467| www.78807.com-福彩3d解码绝密| www.4774.me-瑞典一分彩开奖号码| www.226755.com-快彩票app下载| www.398751.com-彩运来官网下载| www.732084.com-微微彩票管网| www.831075.com-彩运来手机客户端| www.4401.com-福彩3d赢钱口诀| www.32251.cc-彩票五等奖-| www.011863.com-周日彩票开什么奖| www.125249.com-球探彩票ios| www.633078.com-中国篮球彩票怎么买| www.875313.com-彩票微社区-| www.69dn.com-皇冠彩票是合法的吗| www.16ik.com-福彩排七走势图| www.8651.com-网易直播七星彩直播| www.68587.cc-福彩3d当天试机号| www.037489.com-爱投彩票ios| www.270978.com-彩788登录地址| www.692371.com-超级彩票骗局| www.794647.cc-最新彩民乐双色球| www.881532.com-电竞博彩有哪些网站| www.997094.com-3d福彩开奖历史| www.fh04.com-湖北快三遗漏一定牛| www.808080.cc-竞彩足球咨询中心| www.898627.com-湖北快三个位走势图| www.976570.com-洛阳宜阳结婚彩礼| www.cp1160.com-分分快三计划单| www.yl03.cc-彩计划下载app| www.97618.com-重庆时时彩团队招人| www.cp73.com-快三彩票技巧| www.871846.com-丰彩涂料-| www.959672.com-彩票一期一计划团队| 大赢家彩票平台www.320661.com| www.9870.in-全国体育彩票试机号| www.630920.com-环彩国际官网平台| www.736346.com-彩虹代刷网克隆密钥| www.850391.com-投入住比例彩客| www.947605.com-实用的彩票投注器| 彩71www.551549.com| www.5688.top-怎么下载彩票软件| www.55912.cc-网投彩票犯法吗| www.115772.com-500彩票比分直| www.751229.com-彩票巴巴是正规的吗| www.984211.com-湖北福彩双色球| www.hw12.com-快三稳定计划| www.0am.com-足彩卖料-| www.wp88.com-江苏快三遗漏号码| www.131223.com-因为彩礼分手| www.907124.com-福彩快三可信吗| www.984326.com-体彩助手官方网站| www.ta6.com-职业彩民心得| www.m23.org-网络彩票平台代理| www.560593.com-网站游戏注册送彩金| www.9495.xyz-海南私彩808论坛| www.84938.com-3d彩漫隐身恶魔| www.121474.com-宁夏体育彩票| www.223823.com-官方福彩幸运快3| www.382857.com-买彩票中了20万| www.213633.com-彩神x靠谱吗| www.35813.cc-重庆时时彩合买跟单| www.81630.com-福彩快三多久开一次| www.333688.com-买体彩法-| www.838303.com-北京快三福利彩票| www.938041.com-双赢彩票平台可靠吗| www.986415.com-今天福彩3d藏头诗| www.gv7.com-内蒙福彩三的| www.tv26.com-网赌快三押大小| www.19jm.com-彩仙阁挂机方案加密| www.1952.org-福彩3d太湖字谜解| www.536578.com-彩票几种-| www.775434.com-香港好彩票-| www.871336.com-高赔彩票平台| www.949290.com-社会福利彩票| www.lg72.com-高手计划中福快三| www.38bp.com-七星彩破解-| www.1763.vip-福利彩票去哪买| www.21020.cc-彩票怎么算中奖金额| www.024889.com-棋牌彩票一体的游戏| www.250616.com-福彩手机购彩可以吗| www.29294.cc-彩虹频道app下载| www.246900.com-乐米彩票官网| www.275289.com-网络时时彩谁在控制| www.393007.com-万博彩票代理反点| www.517610.com-购彩计划软件手机版| www.575395.com-一分快三大小方法| www.637657.com-彩虹6号客服| www.850991.com-体彩串关计算器| www.920363.com-快三的歌曲名字| www.976280.com-新郑结婚彩礼多少钱| www.cp469.com-安徽快三投注一定件| www.85528.cc-彩票缩水软件是什么| www.7795.net-玩彩票心德-| www.2723.wang-福彩3d天宇系列图| www.29po.com-荷花水彩图片| www.208766.com-体彩11选5-| www.320077.com-二元彩票-| www.448351.cc-彩票代买app| www.632494.com-海南七星彩网| www.739424.com-999彩票网下载| www.860870.com-体彩山东11选五| www.941283.com-彩票套利要坐牢吗| www.kq3.com-彩票开奖走势图| www.yf98.com-彩票店早上几点开门| www.089771.com-中福在线时时彩缩水| www.cl76.com-安徽快三遗漏号技巧| www.69060.com-卖彩票需要什么手续| www.040364.com-中彩网代理-| www.98of.com-黑彩票哪里有卖的| www.sr47.com-高手彩坛彩票大全| www.715855.com-爱购彩票手机下载| www.913695.com-国彩平台注册| www.v63.com-体彩规律-| www.18515.cc-好彩网app合法么| 中彩网www.91233s.com| 500彩票网www.97655y.com|