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.0813.org-体育足彩网上怎么买| www.507.pw-1分钟时时彩走势图| www.47uj.com-118彩票在线客服| www.746381.com-冀彩宝快三-| www.872343.com-贵州体彩在哪里兑奖| www.md76.com-江苏快三杀号定胆| www.32bv.com-周六哪个彩票开奖| www.604681.com-中彩国际是真的吗| www.802565.com-福彩英雄看胆给大家| www.962189.com-凤凰彩票网合法吗| www.2770.cn-御彩轩时时计划| www.65518.com-天天中彩吧彩图汇总| www.279339.com-福利彩票qq群| www.551525.com-快乐彩中奖概率| www.8552.biz-世界杯冠亚军竞彩| www.89591.com-黄鹤楼28的迷彩烟| www.155761.com-彩票倍数-| www.376572.com-体育彩票qq号| www.079234.com-时时彩三星和尾| www.237267.com-浙江体育彩票| www.321418.com-竞彩全民竞技| www.411789.com-彩票怎么玩视频| www.527916.com-荷兰五分彩官网| www.611060.com-彩38官方网站网址| www.911188.com-k彩一客服-| www.ds99.com-彩票软件ios| www.32bf.com-彩虹六号头像| www.5720.top-中国体彩几位数| www.085399.com-梦想彩票苹果下载| www.533529.com-快乐彩怎么玩法| www.186331.com-华夏幸运快三| www.283385.com-七星彩随机选号| www.83708.com-彩票的利弊英语作文| www.059735.com-吉林体彩中心地址| www.242924.com-合发彩票骗局| www.387387.com-派彩河北快三| www.557116.com-福利彩票交税率| www.654193.com-福彩投注助手可靠吗| www.745320.com-快三模拟投注下载| www.855337.com-凤祥国际购彩| www.969539.com-酷彩吧网页版| www.ih69.com-竞彩足球彩票app| www.4595.cn-90后彩票机选中奖| www.11699.com-体育彩票大乐透下期| www.qw73.com-五分快三顺口溜| www.634838.com-晋江七彩狐泳装| www.768402.com-电信免费彩铃| www.847038.com-山东体彩app注册| www.930417.com-彩票玩法中奖规则| www.986500.com-中国体育竞猜彩票| www.cd60.com-彩票报纸-| www.xe55.com-河南福彩跑马直播| www.030060.com-yy彩票注册登录| www.548257.com-彩票共赢-| www.75yf.com-手机下载的彩利坑人| www.27482.com-竞彩霸主双色球预测| www.739501.com-福利头条彩票app| www.915726.com-加盟福彩-| www.978047.com-猫彩铅笔画-| www.cp1389.com-江西新快三-| www.51209.com-58彩票ios-| www.157057.com-北京体彩在哪兑奖| www.46466.com-官方时时彩走势图| www.11859.cc-6678彩票合法么| www.87133.com-彩宝贝3d杀号| www.059146.com-彩票快3咋改时间了| www.yv74.com-云南省福彩中心地址| www.41su.com-九州彩票线路导航| www.96520.cc-体彩竞彩比赛时间| www.183671.com-吉林福利彩票快3| www.333241.com-玩彩倍投技巧| www.477770.com-中国福利彩票积分| www.603597.com-山西彩票纠纷| www.743322.com-金山彩票苹果版下载| www.816208.com-时时彩顺子最大遗漏| www.997881.com-福彩和制图-| www.fv05.com-兼职帮投福彩游戏| www.48146.com-竞彩足球购彩软件| www.835268.com-免税红好彩-| www.698947.com-彩铅零食-| www.875943.com-省份快三是什么彩票| 亚洲彩www.68568y.com| www.n64.biz-广东十分彩走势图| www.371751.com-体育彩票多久能注销| www.048147.com-爱彩乐北京十一选五| www.684199.com-下载彩八app| www.918250.com-下载900彩票| www.6tf.com-送彩经-| www.120268.com-什么是腾讯五分彩| www.235577.com-中国足彩500网| www.346541.com-足彩玩外围如何赚钱| www.915272.com-够力体彩排列五奖表| www.971481.com-幸福彩票手机报官网| www.hb.cc-福彩3d投注技巧| www.vb45.com-香港权威彩神网网址| www.6698.xyz-什么彩票不作弊| www.199881.com-1分快三规律| www.089892.com-重庆分分彩开奖号码| www.410369.com-足彩胜负平14场| www.581619.com-百姓彩票客户端下载| www.330077.com-国彩吧-| www.0518.cc-体彩大乐透试机| www.62155.com-福彩大赢家论坛| www.65649.cc-丹东3d彩吧图库| www.079785.com-双色球中彩网| www.513360.com-购彩app是真的吗| www.117009.com-体育彩票单张倍数| www.020631.com-手机网上怎样买彩票| www.8132.wang-上海向彩-| www.735774.com-招聘彩票分析师| www.48798.com-竞彩哪里买-| www.865983.com-怎么注册福利彩票| www.2578.in-用数学的眼光买彩票| www.vr42.com-快三走势分析图| www.025210.com-快三街机游戏大全| www.109792.com-福彩3d每期猜一字| www.937091.com-彩票两元走势图| www.297565.com-一定牛河北快三遗漏| www.37vy.com-福建体彩幸运| www.6009.me-彩票机兑奖-| www.69506.com-浩博彩票平台| www.39ma.com-手机七星彩投注网| www.917208.com-88彩票网正规吗| www.365237.cc-彩裤宝典ios| www.652696.com-北京时时彩平台官网| www.275893.com-大运河彩票怎么样| www.447401.com-众彩网靠谱吗| www.68747.com-乐彩网官方网站| www.728267.com-附近竞彩店-| www.95zk.com-福彩3d白金图标版| www.687478.com-出名的彩票销售系统| www.688690.com-好彩1选号规律| www.637270.com-福彩原副主任获刑| www.79764.com-竞彩足球稳赚概率| www.67bb.com-分分彩做号软件| www.779805.com-祥瑞彩云彩票| www.851850.com-秒开时时彩破解版| www.910061.com-胜利彩票官方网| www.966362.com-澳门五分彩怎么样| 500彩票www.50052f.com| www.389884.com-分分彩赢了一年| www.939535.com-彩神大发快三计划| www.bk83.com-神州时时彩app| www.xg40.com-977彩票网站| www.14sx.com-安徽体彩大奖| www.2684.me-约彩彩票停售| www.9534.cn-四个数字啥子彩票| www.376935.com-qq时时彩计划| www.505393.com-博彩哪里找客源| www.573009.com-意甲中国足彩网| www.ul92.com-内蒙古体彩网app| www.582165.com-广州一定发网络彩票| www.29158.com-手机咋玩彩票| www.321698.com-人工智能彩票预测| www.9313.net-17500彩票-| www.48066.com-七乐彩胆拖投注价格| www.497456.com-王者彩票团队计划| www.566826.com-河南大乐透彩票中心| www.787980.com-快三投注口诀| www.86qo.com-爱开彩彩-| www.7lq.com-美术彩铅画图片大全| www.57zw.com-澳彩即时赔率| www.610.in-彩88官网下载| www.7886.pw-澳门好彩运饭店|