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天

知道了
亚洲28 www.4089.com-90304期体彩| www.951969.com-快开彩是什么意思| 500彩票www.946277.com| www.60942.com-环球彩票骗局| www.35875.com-爱彩乐专家推荐| www.513077.com-好运来彩票邀请码| www.771462.com-吉林快三预测13号| www.206303.com-彩票端正规吗| www.57912.cc-乐意彩票-| www.872966.com-彩票时时彩网上购买| www.00242.com-258彩票在线| www.431888.com-9944天下彩网| www.848912.com-彩票性缘小艳小波| www.967252.com-3口福彩-| www.uw9.com-彩票计划软件app| www.682011.com-多多中彩票下载| www.774408.com-永利网络博彩排名| www.889849.com-福彩最早第一期| www.974341.com-102彩票-| www.ar96.com-贵州彩票中奖| www.i22.in-网易福彩开奖直播| www.002.cx-彩票十一放假吗| www.08112.com-160彩票大发快三| www.61627.cc-中国福利彩票事件| 同乐彩票www.029781.com| www.753909.com-北京时时彩数据分析| www.946990.com-宝赢彩票软件破解版| 天下彩www.335484.com| www.7907.vip-生肖彩结果-| www.2566.net-体彩扑克中奖规则| www.579669.com-彩世家app-| www.749896.com-排列三字谜双彩论坛| www.873587.com-青蛙彩票80700| www.960629.com-933彩票软件下载| 天天彩票www.54968f.com| www.018307.com-傲赢彩票app下载| www.529122.com-七乐彩胆码汇总预测| www.48nf.com-80彩票软件靠谱吗| www.021983.com-购物送彩票在哪里领| www.237164.com-体彩e球彩奖金规则| www.553308.com-足球彩票让负| www.16164.cc-江苏体彩中心主任| www.59322.cc-人工智能预测彩票| www.108830.com-富贵彩app-| www.934505.com-湖北快三规律破解| www.mh78.com-彩票女-| www.539359.com-深圳牛球球福利彩票| www.5214.xyz-大白菜博彩娱乐论坛| www.334348.com-香港快三有什么技巧| www.466818.com-中国体肓彩票排列5| www.556364.com-彩乐汇网站-| www.617811.com-提亲的时候给彩礼吗| www.828947.com-迅盈彩票-| www.947905.com-超级彩票代打兼职| 818合彩www.www.8000hc.com| www.mj20.com-正规十大时时彩网站| www.957862.com-专家推选一注七星彩| 博友彩www.195322.com| www.23au.com-双彩网排三排五论坛| www.486.in-彩之星印刷-| www.6447.xyz-天天体彩下载官网| www.597123.com-意大利彩金项链价格| www.553862.com-福彩助学项目概况| www.25477.com-学彩铅风景画| www.131755.com-福建彩礼价格表| www.206528.com-有没有好的彩票平台| www.681250.com-怎么劝诫买彩票| www.773117.com-彩票七乐彩| www.865829.com-福彩快3跨度号码表| www.964289.com-欧洲五分彩-| www.xw9.com-大发快三邀请码链接| www.701609.com-买彩票被骗能追回么| www.44zm.com-代理网上购物彩票| 美的彩票www.89338k.com| www.067.bid-叶随风体彩现场开奖| www.e10.in-今晚竞彩-| www.0664.pw-线上彩票在哪里买| www.22675.cc-彩票做私庄吃了几万| www.209340.com-彩票开奖快3| www.283318.com-体彩七星彩如何玩| www.731240.com-天天好彩开奖时间| 网易彩票www.084wy.com| www.911970.com-安徽安徽彩票快三| www.993978.com-彩票最多能中多少钱| www.513106.com-郑州乐彩科技股份| www.892999.com-kk彩票网-| www.953426.com-310竞彩足球推荐| www.996794.com-广东快乐彩开奖号码| www.oz0.com-第一次买彩票就中奖| www.nh53.com-全民福彩app| www.o99.top-玩彩票老头预测| www.602053.com-重庆买彩票哥| www.46493.com-时时彩分析软件排名| www.006359.com-体彩在线购买| www.718312.com-福彩快乐十分害人| www.846084.com-支付宝彩票兑奖| www.932577.com-106com彩票-| 网易彩票www.177417.com| www.rx64.com-分分彩票网-| www.27yq.com-玩快三的视频| www.379786.com-体育7星彩开奖| www.954429.com-中国彩宝网-| www.704891.com-最新足彩比分结果| www.225960.com-酷发财团队彩票计划| www.328705.com-博彩对冲套利| www.90nf.com-欢乐中彩票-| www.4723.xyz-邓州彩票大奖得主| www.bs38.cc-11选5购彩平台| www.095820.com-中福彩国际文化| www.642123.com-特彩吧9949网| www.190197.com-安徽安徽快三形态| www.300021.com-123彩票平台| www.130835.com-安然七星彩-| www.208951.com-彩81-| www.096345.com-排列五凤彩网专家| www.165501.com-福彩中心上班待遇| www.474613.com-博恩说彩公众号| www.582959.com-七克台彩玉原石| www.678655.com-旧版彩客网-| www.759600.com-体育彩票f1-| www.828838.com-天天彩票980| www.891007.com-至尊彩app安装| www.954215.com-七星彩开奖今天| 盛大彩票www.aa0090.com| www.723829.com-彩赢家乐和彩彩票| www.44247.com-福建体彩31阿四| www.99262.com-快三大小研究| www.150734.com-彩票三的免费过滤器| www.122447.com-酷彩日本官网| www.137428.com-网上跟计划买彩票| www.zk67.com-快三买和值怎么玩| www.46cl.com-印象彩-| www.227.cm-8k彩票有几年了| www.2904.vip-福彩倍投计算器| www.8863.biz-哪个大学有彩票专业| www.37827.cc-彩票234-| www.236534.com-一分钟快三下载安装| www.969555.com-酷彩吧客户端下载| www.cp7787.com-体彩大乐透规则| www.vk32.com-陕西福彩20选八| www.14wi.com-01彩票是什么意思| www.544.me-彩票自售机-| www.208484.com-十分彩app-| www.308809.com-高手彩票资料网| www.413084.com-卖福彩提成-| www.523949.com-重庆时时彩最稳打法| www.598786.com-黑彩三d玩法介绍| www.662854.com-关于国彩-| www.750628.com-彩票概率学研究| www.816677.com-北京快三彩票赌大小| www.886760.com-正规官方彩票购彩网| www.954232.com-709彩票ios-| 中彩网www.81233p.com| www.kd77.cc-体彩排列七走势图| www.516114.com-下载彩之王-| www.776775.com-彩神吧-| www.433968.com-福利彩技巧-| www.wq3.com-下载彩票开奖大全| www.333348.com-宁波公司彩票| www.043896.com-福利彩票扫一扫| www.115698.com-大发快三计算| www.189642.com-河南快三历史开奖| www.249522.com-彩虫7下载-| www.333024.com-彩票的数学规律|