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.306029.com-彩票1216网站| www.419377.com-王牌彩票口碑怎么样| www.329175.com-重庆时彩网-| www.3299.cn-万达彩票下载| www.566453.com-中彩三局金-| www.688655.com-广东福彩官网首页| www.773229.com-彩票送彩金16| www.846438.com-体彩福彩合并申请书| www.923951.com-cp55彩票-| www.979130.com-七星彩彩经网| www.cp3371.com-江苏快三是真的假的| www.3679.wang-竞彩足球竞彩版| www.137557.com-举报福彩-| www.nz75.com-百盈彩票主页| www.575662.com-可用的彩票app| www.jl8.com-吉林快三下载安装| www.xx12.com-吉祥彩票下载| www.612855.com-d8彩票平台-| www.683483.com-彩票过滤-| www.761202.com-彩礼钱是给谁的| www.101161.com-彩票趋势软件| www.811402.com-福彩奖号回顾| www.523013.com-七彩乐居家政公司| www.574605.com-58彩票注册-| www.680887.com-中福彩票中福快3| www.764142.com-彩票注册送3元| www.898663.com-足彩让球规则详解| www.967445.com-福彩3d高手群微信| www.cai94.cc-快三走势图分析预测| www.365190.cc-彩票近期中奖号| www.500061.com-吉林快三一定和值| www.570813.com-七彩山鸡苗怎么养| www.635389.com-星光购彩票官网平台| www.702049.com-彩虹竞彩app| www.785885.com-彩票假的吗-| www.866685.cc-天津时时采彩开奖号| www.ef89.com-加州快三彩票| www.121776.com-福彩案怎么发现的| www.194650.com-福彩三d大小走势图| www.075399.com-七乐彩除3走势图| www.253319.com-竞彩猫app下载| www.334933.com-鼎吉国际彩票骗局| www.414314.com-彩票pk10玩法| www.515173.com-什么叫七星彩三字现| www.595300.com-福彩弘烁图迷| www.665781.com-彩宝彩票注册| www.733707.com-篮球体彩分析| www.802231.com-彩票站低价出兑| www.876393.com-怎么看快三彩票规律| www.947057.com-福彩高频彩新政策| www.995387.com-北京彩民中奖| www.227.live-重庆时时彩5星复试| www.991858.com-大乐彩开奖结果查询| www.dj80.com-三分快三计划全天| www.310374.com-山东体彩论坛电脑版| www.865617.com-新快三心得-| www.nu63.com-网上买彩票算赌博吗| www.31xk.com-徐州体彩周六兑奖吗| www.0533.xyz-河北彩未图片| www.9278.net-乐彩客是正规的么| www.407748.com-看看福彩3d专业版| www.522739.com-分分彩买大小技巧| www.954913.com-澳洲3分彩-| 500彩票网www.65707l.com| www.hs05.com-808彩票网籍册子| www.a03.net-大通彩票手机版| www.24nu.com-趣发彩票app| www.96qf.com-足彩买单关稳赚不赔| www.3513.win-天天爱彩票怎么回事| www.9568.org-一支黑一支彩| www.40616.com-端彩祥云app| www.89382.com-福彩8676-| www.053078.com-有个伯爵彩票网站| www.127878.com-3d走势彩吧-| www.199223.com-江苏快三推荐号码| www.261712.com-澳客网竞彩胜平负| www.288663.com-熊猫竞彩app| www.363549.com-即时开彩下载安装8| www.525996.com-双色球彩88网| www.595160.com-双彩论坛3d双采图| www.683695.com-779彩票平台| www.761422.com-天天中彩票软件下载| www.874422.com-七行彩开奖结果查询| www.958312.com-福彩3d百家号| www.la55.com-江苏快三号码统计| www.x44.top-wwccm乐彩网| www.85hi.com-陕西福彩中心电话| www.6kw.com-饭店做活动送彩票| www.363671.com-彩票数字游戏是什么| www.653621.com-章鱼彩票竞猜| www.465968.com-七乐彩历史号| www.22161.com-下载中国福彩官方网| www.97893.com-彩世界计划app| www.091273.com-百姓彩票登录| www.974395.com-星期五有什么彩票| www.837698.com-京彩生活app下载| www.931056.com-南洋彩哪里看开奖| 华为彩票www.hw82.com| www.cc90.cc-彩票规律计算公式| www.z16.top-福彩3第图迷| www.69mt.com-金沙送彩金得网站| www.1791.xyz-万人彩app-| www.7766.top-彩九直播-| www.32078.com-福彩二十选三| www.85900.com-安徽体彩6十1走势| www.057721.com-七星彩玩发-| www.137763.com-七星彩在线缩水工具| www.226225.com-福利彩票的宗旨| www.314798.com-七彩视界-| www.389886.com-彩票这么难中奖啊| www.743598.com-购彩111骗局| www.93zf.com-101彩票平台登录| www.6545.com-信彩彩票投注平台| www.33189.com-福彩七乐彩开奖公后| www.024937.com-彩票缩水选号| www.130433.com-七乐彩杀号定胆专家| www.282099.com-七乐彩推荐-| www.447779.com-福彩3d1d玩法| www.663332.com-七乐彩软件-| www.u38.club-赢彩网站可靠吗| www.85no.com-福彩中彩网三d开机| www.3539.cc-彩民周刊何明七乐彩| www.13854.com-霸主彩票软件可信吗| www.69578.com-彩民彩票软件正规么| www.068033.com-怎么制作彩票app| www.163463.com-网络体彩打票员| www.244289.com-中国福利彩票网点| www.356438.com-彩票充10-| www.61758.com-领航彩票-| www.401444.com-七星彩长居-| www.626882.com-香港五分跑马彩票| www.951871.com-彩神网页-| www.732791.com-体彩5开奖号码| www.fm4.cc-内蒙古快三预测专家| www.111584.com-彩票208-| www.305880.com-也买彩官网-| www.78389.cc-足彩加奖-| www.180667.com-旺彩苹果版-| www.559926.com-双彩论坛3d字迷解| www.086895.com-七乐彩3十1几等奖| www.674234.com-3月28号的彩票| www.71911.com-郎咸平讲彩票视频| www.901967.com-彩票奖金规则| www.023.hk-彩票排三中奖结果| www.3tj.com-福彩专家杀号2元网| www.7606.top-新浪爱彩pc版| www.142026.com-中国正规彩票app| www.972459.com-彩票双色球机选| www.960324.com-酷彩吧靠谱-| www.8027.org-早教彩虹伞游戏教案| www.740718.com-澳彩篮球-| www.996457.com-佬牛足彩解盘| www.hu83.com-快三杀号专家| www.353743.com-凤凰网3官网彩票| www.832707.com-七彩草图片大全| www.bf9.com-湖北快三一定牛预| www.96702.com-博纳彩票是骗子吗| www.21269.cc-豪赢彩票app| www.870504.com-亿发彩票官方网站| www.oy00.com-娱乐快三是什么| www.079956.com-为什么快三不出豹子| www.686446.com-澳博彩票有限公司| www.958862.com-湖北省福彩中心官网| www.am85.cc-苏州市福利彩票中心|