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.949763.com-中华彩票李迎| www.574.vip-75秒时时彩官网| www.7028.biz-福彩7星彩-| www.636381.com-彩虹挂在天上像什么| www.311650.com-分分钟中彩票| www.358216.com-足彩六场半全场胜负| www.66757.com-离我附近的彩票站| www.65cl.com-双色球经典说彩| www.6139.cm-神圣彩票平台怎么样| www.0724.date-彩票店套利-| www.41078.com-app中彩网-| www.g37.club-七星彩局王-| www.842234.com-玩彩票怎么分配资金| www.158420.com-足彩竞彩北单统计| www.0452.site-彩票走势图360| www.89ia.com-属羊买彩票幸运数字| www.99637.cc-重庆时时彩破解漏洞| www.tx98.com-彩票开奖3d试机号| 500万彩票www.39500s.com| www.772442.com-篮球博彩app| www.125286.com-特区彩票论坛开| www.269592.com-彩名彩票-| www.3819.top-七星彩冷热-| www.484105.com-旭彩官方旗舰店| www.80484.com-河北盗金库买彩票| www.bk28.cc-内蒙古快三中奖绝招| www.744641.com-华彩生活下载| www.727571.com-福彩赵公明专家预测| www.872595.com-福彩迷app可信吗| www.242800.com-常州福彩中奖| www.447116.com-叶子主持福彩节目| www.1532.cc-内快三开奖结果| www.94gw.com-七星彩走势预测分析| www.10840.com-3d牛彩字谜-| www.093207.com-彩钢瓦围挡多少钱一| www.161019.com-摩羯足彩预测| www.165098.com-中彩网的预测| www.169010.com-湖北快三走势图今天| www.88.me-e赢彩注册-| www.934482.com-安微快彩怎么下载| www.am19.cc-河北快三老版走势图| www.7065.cm-幸运彩代理-| www.45600.cc-彩薇花美容霜的功效| www.236898.com-竞彩足球比-| www.329327.com-湖北福利彩票中心| www.807258.com-足球彩票过关怎么玩| www.892796.com-新2彩票网-| www.974210.com-好运来彩票网骗局| www.cp6378.com-竞彩比分-| www.og42.com-160彩票app-| www.080067.com-买彩票就用一个公式| www.140045.com-网上购彩票如何兑奖| www.253715.com-一分时时彩官方网站| www.363046.com-福彩选四开奖查询| www.459758.com-体彩排列3d断组| www.550003.com-宝宝计划时时彩| www.767318.com-乐彩双色球走势图| www.876518.com-天津时时彩玩法| www.002967.com-10分快三计划预测| www.639008.com-乐和彩彩票走势图| www.725614.com-彩票是真的么| www.6441.vip-福彩有哪些玩的| www.9186.biz-中国彩吧图库手机版| www.95235.com-彩妆盘品牌-| www.681672.com-下载豪彩-| www.854628.com-红牛快三开奖结果| www.929494.com-彩票开奖了-| www.984290.com-微信加人买高频彩| www.bp93.com-彩票过滤大师手机版| www.uw76.com-人人彩票靠谱吗| www.o91.net-体彩微博-| www.72kd.com-足彩14场36期| www.4123.cm-彩虹无人机价格| www.9501.org-网上哪里卖海南私彩| www.5487.top-彩虹岛官网页面| www.mv42.com-全球彩app-| www.54808.cc-微信彩票群是骗局吗| www.991272.com-福彩121网-| www.872780.com-购彩大厅与uu直播| www.950261.com-金龙彩票苹果版| 风之彩www.11fzc.com| www.254635.com-好彩app是真的吗| www.43ve.com-叠彩区-| www.8308.top-江西萍乡体育彩票| www.29488.cc-数字彩彩票软件| www.812028.com-乐彩论坛净台版| www.252322.com-彩票选号优化方法| www.343970.com-乐宝彩票是真的吗| www.jn4.com-河北快三平台下载| www.wq09.com-中彩网11选5| www.21tv.com-黑客侵入福彩| www.83sq.com-什么彩票五个数字| www.19077.cc-中国体彩网现场直播| www.v51.com-四字彩票用语| www.777432.com-澳客赢家彩票客户端| www.565776.com-合肥竞彩网点申请| www.637228.com-双色球中彩网走势| www.700332.com-快三游戏苹果版本| www.784813.com-大大彩票网站下载| www.859835.com-信搏彩票网址| www.948615.com-彩票发行-| 快彩在线www.2632h.com| www.428444.com-苏州体彩七位数| www.047056.com-51彩票的网址| www.9635.cn-排列五走势图彩经网| www.282999.cc-彩票规律破解大乐透| www.362935.com-写自然景物彩虹作文| www.333168.com-公司送员工彩票| www.136880.com-火箭彩app-| www.542518.com-彩票大乐透中奖条件| www.731440.com-易彩堂主页搜不到| www.000304.com-专业玩彩人-| www.087226.com-台湾福星彩开奖结果| www.168806.com-时时彩胆拖投注| www.cr10.com-彩客站是真的吗| www.09oa.com-双彩票色球开奖结果| www.4416.vip-网络彩票赛车直播| www.a18.vip-彩票九怎么样| www.315558.com-上海彩票店生意转让| www.876077.com-京彩app官方下载| www.980260.com-彩票站知道中奖人| www.xj29.cc-好彩客app下载| www.94ei.com-三d彩吧论坛首页| www.6883.loan-南粤风彩复式| www.cai0977.com安徽快三开奖是多少| www.785089.com-财富彩票官方网站| www.3567.xyz-福利动物彩票开奖| www.41893.com-中彩吧2020黑网| www.82337.com-江苏快三回血导师| www.055091.com-成语彩票是什么意思| www.133754.com-好彩∫开奖结果| www.213092.com-江苏快三下载| www.226368.com-凤凰彩票导师说稳赚| www.0933.date-竞彩网重庆-| www.381129.com-七乐彩开奖时间| www.479966.com-澳门分分彩开奖记录| www.554872.com-本港彩票三肖六码| www.654517.com-易彩怎么玩-| www.749356.com-福彩官方购彩app| www.849996.com-腾讯分分彩天天计划| www.980614.com-手机玩彩票输| www.jh0.cc-网上买快三技巧| www.718261.com-山东体彩客户端| www.257625.com-破解彩票软件| www.304958.com-11选5彩票官方| www.269.tv-上海快三结果| www.129690.com-体育彩票有多少球| www.665999.com-航天彩虹股价| www.760131.com-台弯福星彩-| www.811085.com-神周彩票网唐龙说彩| www.879241.com-彩票怎么投注最稳| www.931422.com-买彩票咒-| www.633856.com-m5彩票线路-| www.6494.com-开心彩票官网| www.96783.com-李永志彩票事件视频| www.0558.la-昨天福彩3d老汉图| www.130960.com-谈彩礼是谁谈| www.365754.cc-彩铅画花卉绘画教程| www.664096.com-时时彩网页源码| www.137648.com-海南省体彩中心| www.966039.com-今日福彩中奖号码| www.600936.com-10元投资彩票赚钱| www.cp7338.com-王者彩票靠谱吗| www.32po.com-0投资彩票赚钱平台|