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.998365.com-清乾隆多种釉彩大瓶| www.qb19.com-查询彩票app| www.292112.com-彩三下载-| www.213748.com-彩神8大发快三| www.335946.com-微博体彩-| www.97js.cc-踩台和彩排-| www.550359.com-交流大厅彩| www.87756.cc-怎么辨别真假彩票站| www.627879.com-凤凰彩1平台客户| www.ag1.cc-福彩快三北京| www.059164.com-体彩可以买nba| www.yg8.com-大发快三破解方法| www.010616.com-熊猫彩票是什么| www.230220.com-盈彩在线app| www.745822.com-e彩票合法吗| www.488695.com-七乐彩上期中奖号码| www.673525.com-k彩彩民福地官网| www.967451.com-彩票群聊名字| www.vj58.com-今日开奖快三河北| www.838052.com-五百万彩票竞彩网| www.050.in-石家庄福彩中奖| www.10611.cc-彩票购手机客户端| www.120286.com-福彩排五开奖走势图| www.002409.com-苏州体彩站点查询| www.00414.com-银川中彩票-| www.33597.com-非凡彩票下载| www.690418.com-重庆竞彩网是真的吗| www.3315.cm-彩票看走势图讲解| www.069410.com-命中中彩双色球预测| www.288391.com-谁会玩大发快三| www.434388.com-681彩票-| www.639008.com-乐和彩彩票走势图| 众发彩票www.658zf.com| www.xb08.com-开心七星彩票论坛| www.701034.com-优信彩票网站首页| www.626249.com-698彩票-| 大赢家彩票平台www.677375.com| www.mh6.cc-搜索内蒙快三| www.xu19.com-买彩票怎么才能中奖| www.34gh.com-河南省体育彩票竞彩| www.9gy.com-体彩最大号码是多少| www.0610.vip-挂彩票啥意思| www.110341.com-原福彩中心主任| www.029569.com-利彩彩票是什么| www.129927.com-福彩055dcc-| www.222675.com-四川成都快三| www.f86.org-华人彩官网注册登录| www.602326.com-游戏厅打彩票技巧| www.698272.com-博众时时彩软件组六| www.794805.com-彩开头的成语| www.878575.cc-足彩全包盈利法| www.951640.com-彩票平台出租可靠么| 500彩票www.51515n.com| www.05252.cc-买彩票贷款还不上| www.67624.com-福彩赌钱机器| www.16222.com-彩运网app下载| www.973125.com-凤彩网彩票网| www.53812.cc-横沥东方亮彩怎么样| www.503012.com-鸿彩330光束灯| www.9888.live-福彩归什么部门管辖| www.742779.com-福建体育彩票走| www.821579.com-福彩彩圣字谜总汇| www.893306.com-彩票复式组合器| www.954892.com-4593彩票-| 全民彩票www.qm72.com| www.hp89.com-上海快三玩法说明| www.17637.cc-足球彩票让球投注| www.539536.com-826cc彩票下载| www.815422.com-吉林快三一百期| www.896728.com-凤凰v彩票主人| www.964161.com-买彩票几点开始| 福利彩票www.78700a.com| www.272961.com-彩票种类-| www.835286.com-蓝色炫彩油画| www.914431.com-彩票166是真的吗| www.983473.com-福利彩票领奖银行| www.bm35.com-nba篮球彩票| www.c61.top-福彩三d和值走势图| www.383028.com-福彩双色球网易杀号| www.315285.com-腾讯分分彩胆码选号| www.252444.com-全民彩票公司| www.891073.com-大奖彩票下载安装| www.781.live-神壬测彩歌诀| www.603187.com-福利彩栗-| www.782336.com-八万彩票-| www.174038.com-安徽体彩十一选五| www.bj59.com-乐盈彩票黑平台| www.01vg.com-彩虹色的花-| www.0230.loan-云南时时彩开奖记录| www.6895.cc-爱彩彩网app| www.736262.com-上海彩票官网| www.kt51.com-上海福利彩快三跨度| www.075204.com-多玩娱乐彩票| www.174128.com-快三网投第一| www.302674.com-977彩票登录| www.375893.com-七星彩数字排列| www.666944.com-国乐彩坑人吗| www.id00.com-彩票新政策-| www.j75.net-千禧彩票-| www.94381.com-篮球竞彩什么软件好| www.99ye.cc-体彩彩票有几种| www.105398.com-牛票票彩票晒票了吗| www.80445.com-中彩网安微快三| www.664525.com-七乐彩开奖今天的| www.767567.com-开心彩票网手机版| www.864663.com-235彩票平台网址| www.946882.com-彩钢工地围挡报价| 好运彩吧www.099386.com| www.1967.top-智慧福彩湖南| www.255322.com-微彩吧下载app| www.834123.com-福彩软件官方下载| www.908008.com-腾讯1分彩开奖结果| www.974216.com-南京福彩开奖结果| www.hq3.com-中国福彩快开彩| www.521449.com-时彩托怎么赚钱| www.40795.com-彩票九官方-| www.95737.com-竞彩足球必中神单| www.944828.com-248彩票全部软件| 500彩票www.50074d.com| www.263207.com-河北快三一定牛开奖| www.097269.com-今天三d彩报| www.390679.com-彩民算不算赌徒| www.499090.com-带你刷彩金的骗局| www.557846.com-金山彩票提款被拒绝| www.540410.com-网络高频彩为什么输| www.4728.cn-中彩票不给钱| www.07800.com-苏州快三计算公式| www.85378.cc-胜负彩一500| www.041815.com-易彩2.0手机版| www.121744.com-胜负彩开奖查询| www.1979.biz-盐城彩莲船-| www.30110.com-彩8娱乐是黑平台| www.88332.cc-春天彩票是真的吗| www.35534.com-点点中彩票下载| www.j33.org-贵州桐梓彩票中奖| www.390769.com-十二生肖彩票开奖| www.568469.com-腾讯分分彩遗漏软件| www.656857.com-竞彩2串1对冲外围| www.822131.com-真龙扫码中奖彩票| www.905132.com-亿彩彩票是不是有托| 彩之家www.00czj.com| www.pg21.com-胜负彩19045| www.cai4222.com内蒙古快三购买| www.26563.com-人人中彩票联系方式| www.90004.cc-想开彩票站怎么申请| www.058163.com-乐彩快三能挣钱吗| www.899216.com-七星彩票彩种| www.961465.com-吉林快三和值参照图| www.181910.com-福彩3d投注技巧| www.127904.com-周杰伦彩虹歌词| www.198950.com-福利彩票怎么算中奖| www.258826.com-胜负彩500足彩| www.55092.cc-今日运势一彩票工具| www.381664.com-肥城彩票体彩目录表| www.2014.org-香港÷和彩-| www.277940.com-博牛彩票导师| www.682508.com-公益时报中华彩讯| www.802502.com-3d彩票小狂人| www.894851.com-中国福利彩票公开奖| www.968186.com-五亿彩票是不是黑网| www.gt51.com-体育彩票排列三| www.xm87.com-快彩在线是不是真的| www.142786.com-彩八官方网站| www.214214.com-足彩分析师排行|