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.954624.com-国外彩票有哪些| www.uc2.cc-福彩3d胆码定双胆| www.77yo.com-足彩领奖须知| www.886963.com-江苏快三爱彩人| www.983440.com-九万彩票是合法吗| www.sk8.cc-快三大小单双走势图| www.09374.com-天天彩票网官网| www.753142.com-中彩吧可靠吗| www.3829.wang-七星彩今天图规| www.586685.com-快三手机计划| www.361355.com-彩蚕饲料-| www.318952.com-七星彩说码划规视频| www.606725.com-五福彩票破解版| www.10vt.com-河北快三高手推荐号| www.01118.com-竞彩足球触屏| www.231055.com-百胜快三登录| www.7ga.com-3d彩票是什么| www.0858.xyz-彩票机器人投注| www.81599.cc-福彩3d昨天的事情| www.054545.com-滴滴彩票下载| www.822272.com-随州福彩中心| www.908222.com-快乐彩票手机版下载| www.977182.com-河南濮阳范县彩礼| www.ob19.com-快3彩票有没有规律| www.430100.cc-水彩本-| www.604554.com-500c0m彩票网| www.772474.com-时时彩遗漏冷热统计| www.114443.com-福彩中心窝案| www.517028.com-凯发彩票靠谱吗| www.19101.cc-体彩跨省能兑奖吗| www.941323.com-大发彩票靠谱吗| 众乐彩票www.389844.com| www.lh77.com-51中彩下载-| www.260158.com-拍彩票查中奖| www.629462.com-时时彩半顺是什么| www.970721.com-买彩票鼓励的话语| www.cf82.com-大发一分快三平台| www.26991.cc-新彩彩票网站| www.993740.com-足球竞彩怎么玩| www.qm12.com-博牛彩票安装| www.765796.com-彩之源软件-| www.843122.com-福彩中心改企后人员| www.890283.com-花生彩票平台| www.500122.cc-淘宝购物送彩| www.110892.com-购买美国强力球彩票| www.193770.com-10选5彩票的玩法| www.265031.com-快三网上有人带着买| www.731705.com-8k彩票大小规律| www.807218.com-温州体彩转让| www.898438.com-竞彩店主自己刷返点| www.970874.com-突然暴富中了彩票| www.mz8.cc-好彩0567下载| www.931002.com-中发彩票用户注册| www.992429.com-快三3能买和值吗| www.cl04.com-浙江温州快三走势| www.vm84.com-十分快三是谁开的| www.15xa.com-江苏竞彩店转让| www.187293.com-重庆时时彩致命漏洞| www.7588.loan-22彩网-| www.0179.cc-国彩网软件下载| www.33rg.com-彩票店利润是多少| www.bu90.com-快三网上投注| www.4567.website体彩35期多少| www.768956.com-买买彩票app| www.873750.com-体育彩票查-| www.954050.com-手机时时彩缩水软件| 500彩票www.50054t.com| www.gg05.com-菠萝彩3d魔图下载| www.370087.com-彩乐乐体彩推荐号| www.503788.com-需要做一个彩票软件| www.678634.com-中国移动彩印下载| www.785548.com-腾讯分分彩官方开奖| www.887097.com-富彩彩票靠谱吗| www.r38.top-开彩妆加盟店| www.300110.com-快三安徽形态走势图| www.924284.com-多金喜彩票可信吗| 彩乐乐www.3005.am| www.nk91.com-佬牛足彩推荐| www.033682.com-易彩网网址-| www.598873.com-彩票源码塔建| www.677209.com-7070彩票安卓版| www.499139.com-106彩票破解方法| www.585009.com-中国彩吧论坛首| www.668983.com-一分彩票走势图| www.753692.com-吉祥彩票网页版| www.855441.com-深圳快乐彩技巧| www.914288.com-手机赚钱彩票| www.978014.com-彩色纸箱加工厂| www.c4.me-爱乐彩号码推荐软件| www.ld84.com-大彩网彩票-| www.m75.biz-彩票平台输钱| www.22pd.com-去彩票门店怎么足彩| www.034580.com-彩名堂计划怎么下载| www.216044.com-体彩玩法-| www.688590.com-北京体彩电话投注| www.533654.com-彩票遗漏概率极限| www.628144.com-三看亲彩调-| www.731425.com-易彩堂计划软件| www.846855.com-彩票都是假的| www.940208.com-金福彩票网手机版| www.jo28.com-微信女的让你玩彩票| www.31fe.com-7星彩对数怎么查看| www.770357.com-开开心心七星彩论坛| www.858429.com-乐购彩票邀请码| www.919068.com-河南快三跨度遗落| www.974194.com-中国3d彩票玩法| 彩票58www.589879.com| www.787969.com-彩票106版168| www.857746.com-盈彩网免费计划下载| www.915937.com-彩拾彩票怎么样| www.971307.com-体彩排列五中奖结果| 大赢家彩票平台www.001059.com| www.ff49.cc-内蒙快三玩法技巧| www.ua87.com-关于全民彩票| www.1169.pw-彩票语录图-| www.325627.com-彩票中奖规则图标| www.516259.com-乐彩赢攻略-| www.587448.com-c8万彩开奖结果| www.225227.com-手机彩票投注靠谱吗| www.91628.com-彩在线计划-| www.118369.com-彩票166下载| www.180533.com-uu快三骗局-| www.296162.com-天天快三-| www.365861.cc-彩铅画市场如何| www.456255.com-官员上班翘腿看彩票| www.543250.com-福彩牛彩图迷| www.604578.com-彩票有几个奖| www.676189.com-天空福彩与你同行| www.387262.com-手机全面钢化膜有彩| www.26se.com-体彩预测家彩网| www.531670.com-彩铅风景作品高清图| www.30202.com-海南彩票软件| www.77276.cc-彩票网站苹果上架| www.2275.in-斯特凡曼德尔彩票| www.02895.com-亚彩会注册平台| www.fr81.com-中彩网一分快三技巧| www.893863.com-爱投彩票安卓| www.999190.com-福利彩票中奖数字| www.303653.com-足彩讨论区虎扑| www.479187.com-七星彩差分-| www.835676.com-福彩3d150-| www.008973.com-qq有彩票吗-| www.630200.com-中彩网三地预测| www.005967.com-网上购买彩票软件| www.200953.com-七星彩今期-| www.552400.cc-心悦彩票-| www.960129.cc-七星彩票送彩金| www.705717.com-彩发发预测-| www.937289.com-神彩福牛双色球| www.860446.com-好彩双爆珠整条图片| www.759708.com-c58彩票官方网站| www.954776.com-福利彩票3月21号| www.o66.top-彩票可以作为赠品吗| www.4902.cc-3a彩票网站-| www.199520.com-山东体彩在线下载| www.cai5557.com快三走势图看哪准| www.572791.com-最好福彩3d软件| www.739904.com-496cc彩票官网| www.ov28.com-中国福利彩票快三| www.3488.vip-美国代购彩票| www.506733.com-福彩113期开奖| www.619357.com-重庆彩票中心地址| www.221252.com-彩票赚钱软件| www.477016.com-福盈门彩票手机版|