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.373927.com-中国河南省福利彩票| www.5859.in-彩票黑客预测| www.cv69.com-湖北省快三开奖号| www.591687.com-西甲看什么博彩公司| www.lt38.com-好彩5分快3-| www.121667.com-赌场买彩票吗| www.215238.com-福利彩票时时彩下载| www.535925.com-彩票7位数开奖| www.q49.org-彩票弃奖记录| www.370013.com-福彩3d开奖| www.571773.com-福彩三d开桨结果| www.654587.com-彩友吧彩民朋友的家| www.56zp.com-体彩报纸哪里订| www.860569.com-外围彩票网站排名| www.116996.com-竞彩足球彩票是官网| www.136787.com-彩票投注站提成| www.248600.com-中国体育彩排列三| www.981892.com-新彩彩票注册送18| www.i36.me-全民彩票官网登录| www.733962.com-彩迷推荐-| www.856365.com-苏州体育彩票兑奖| www.940798.com-华人彩票官方网站| 彩票驿站www.2350i.com| www.575655.com-中彩网积分干嘛的| www.664659.com-七乐彩二十四期直播| www.936647.com-爱刮刮的彩票成本| 天天彩票www.210883.com| www.le11.com-天天中彩下载安装| www.s86.pw-呼市福彩电话| www.59vf.com-单注彩票上限| www.35ws.com-2017体彩杯沈阳| www.u92.cc-中福彩大奖如何领奖| www.860158.com-时时彩票安卓版下载| www.954082.com-体彩竞彩胜平负开奖| www.bq67.com-彩票刷返利-| www.016210.com-彩票365官网| www.033137.com-678彩票网下载| www.737923.com-福彩五亿大奖作弊| www.827339.com-时时彩总和值玩法| www.921223.com-福彩3d怎么算跨度| www.980466.com-贵宾室彩票软件下载| www.cd5.com-36选7好彩3奖金| www.809979.com-体彩福彩的开奖结果| www.066731.com-u9彩票软件-| www.130897.com-重庆时时彩骗局曝光| www.230621.com-搜索728彩票| www.576508.com-爱乐彩走势图| www.255967.com-玩时时彩输了好惨| www.358564.com-有两元的彩票| www.549007.com-高手彩票、彩票高手| www.636358.com-星期六有什么彩票买| www.725694.com-彩票官方网-| www.654206.com-速8彩票真假问题| www.124943.com-迷彩兔是哪里的网站| www.089051.com-分分快三怎么下载| www.gl75.com-彩票中奖指南| www.g69.cc-彩易彩票网-| www.44kk.cc-彩票推广经验| www.881482.com-58彩票官网-| www.75587.cc-中彩在线股东| www.8ym.com-传统足彩的返奖率| www.461810.com-牛彩网图迷总汇| www.073730.com-金彩网是不是骗局| www.49yb.com-足彩凯利方差app| www.669687.com-四位码彩票-| www.48ik.com-七乐彩同尾数走势图| www.1219.in-网易的人人红彩票| www.69594.com-福利彩票创始人| www.028780.com-彩宝彩票网站| www.373383.com-快三大型平台| www.62251.cc-三彩彩票网站| www.906822.com-快三的中奖概率最高| 500彩票www.510477.com| www.04rn.com-水彩入门画笔| www.645544.com-陶瓷新彩心得| www.k50.mobi-亚博彩票-| www.10191.com-9亿彩票官网| www.254063.com-快彩乐老11选5| www.384488.com-福利彩票试题| www.617672.com-廊坊体彩中心| www.090054.com-我想代理一个时时彩| www.190803.com-快三手游-| www.155836.com-时时彩机器人软件| www.393954.com-色彩对比作业图| www.175670.com-一分快三怎样稳赚| 8618彩票www.aa8618.com| www.te40.com-江西快三推荐号码| www.32jn.com-赢彩-| www.328365.com-彩票彩之网下载| www.661342.com-彩票专业的学校| www.729114.com-福彩3d网址-| www.411622.com-竞彩哪个靠谱| www.356508.com-彩票快餐图-| www.261805.com-腾讯快三计划师| www.337439.com-青海福利彩票3d| www.405831.com-海南七星彩长条图| www.830810.com-福彩今天和值大小| www.786683.com-极速3d彩票破解| www.jo39.com-微信49个号码彩票| www.326876.com-36○彩票全国| www.wa68.com-双色球人人彩票下载| www.974392.com-彩票分几种-| www.cv30.com-凤凰私彩-| www.19eq.com-买彩票借钱的群| www.aa57.com-怎么看彩票走势图| www.287001.com-安徽快三投注软件| www.739446.com-盈彩团队骗局揭秘| www.852258.com-长沙福彩中心| www.905255.com-足彩网上购买| www.960422.com-竟彩宝-| 福运www.fyyy2.com| www.587375.com-鸿彩投注怎么样| www.864567.com-彩膜手机-| www.697828.com-天天彩票登陆| www.375757.com-彩虹六号刘醒的喷子| www.541438.com-彩票平台怎么做代理| www.983323.com-彩票平台黑钱报警| www.hx16.cc-福彩3d组三走势图| www.2rh.com-国家彩票一年的利润| www.316210.com-旺彩31-| www.331722.com-福彩数字3单式| www.28313.com-贵州快三遗漏数据| www.871031.com-网络彩票投注软件| www.133842.com-淘彩票注册风险| www.27832.cc-时时彩高手在民间| www.171003.com-彩神8-| www.264224.com-360彩票走势| www.477792.com-盈彩彩票app官网| www.7734.org-爱购彩平台安全吗| www.613671.com-网上怎么买彩票手机| www.330146.com-牛彩网—彩搜网| www.250588.com-中彩娱乐是真的吗| www.8127.biz-天天赢彩票是坑| www.36145.com-盛源彩票下载| www.433.net-2018网售彩票| www.039081.com-舟山快2彩票走势图| www.330693.com-河北福彩网20选5| www.610655.com-彩票领奖作假| www.5608.vip-彩票直通车安全吗| www.523105.com-app刷彩-| www.692339.com-网络博彩账号被冻结| www.751661.com-可以提现的手机彩票| www.805080.com-竞彩为什么不开中超| www.868567.com-七星彩规律软件免费| www.911753.com-福彩3d一注2块钱| www.963586.com-彩票入门与技巧下载| 天天彩票www.2373w.com| www.7452.vip-彩票走势图游泳| www.32256.com-我要福彩-| www.68152.cc-新彩吧图谜字谜| www.707607.com-彩588app-| www.779115.com-鸿运5分彩-| www.855024.com-中竟彩网首页| www.918765.com-信誉好的外围彩票| www.979730.com-彩票导航重庆时时彩| www.cf96.com-安徽省福彩快三| www.rx88.cc-快三两码搭配| www.114246.com-福利彩票最新规定| www.686004.com-时时彩2期必中计划| www.588667.com-七星彩网上几点开奖| www.56bx.com-下载上海福利彩票| www.386927.com-体育彩票5个号| www.206119.com-代玩彩票兼职五十块| www.261703.com-竞彩让球-|