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.0613.me-星彩娱乐官方下载| www.7557.cc-彩票计算器传销| www.wm49.com-178彩票平台| www.rr0.com-上海快三走势图和| www.225890.com-快乐彩12选5直播| www.386302.com-重庆体彩网注册彩| www.972339.com-福彩6十1开奖公告| www.pn53.com-乐彩网摘-| www.41kd.com-亿菲彩票登录| www.111732.com-百盈时时彩正规吗| www.013130.com-海南七星彩预测图| www.017603.com-福彩3d走势图2元| www.309353.com-遵义快三开奖结果| www.455501.com-乐彩平台真的假的| www.489658.com-7乐彩走势-| www.17lc.com-七乐彩2等奖是多少| www.2857.cn-七星彩开奖今晚| www.mb4.com-吉林省快三遗漏| www.86226.cc-天吉网彩票纶坛| www.29226.com-搜狗彩票不给提钱| www.54599.cc-手机验证领18彩金| www.838350.com-快三计划三期必中| www.941573.com-三星彩票娱乐兼职| www.cp6732.com-发彩网-| www.169723.com-快三连线走势图| www.160172.com-丰盈彩票app下载| www.93463.com-求加入福彩快三| www.130980.com-结婚彩礼价目表| www.762517.com-分分时彩是真的吗| www.65xj.com-千禧彩票9955| www.718575.com-彩虹是什么呢| www.804115.com-注册火箭娱乐时时彩| www.888798.cc-778彩票-| www.965383.com-快三输了10万| 600万彩票www.571833.com| 彩世界www.22csj.com| www.3615.online上海竞彩足球店| www.544337.com-快三全天在线计划| www.715803.com-颖彩双色球下期预测| www.831663.com-高频彩票销量| www.953035.com-体育彩票包括哪些| www.41rl.com-彩吧彩吧-| www.9642.biz-彩独2安卓下载| www.cai9999.cc-分分快三全天计划| www.5ka.cc-常州体彩店转让信息| www.576204.com-三d字谜牛彩摘网| www.282788.com-技术型彩民选号方法| www.327929.com-彩乐网福中网资料| www.176948.com-一分快三正规吗| www.682286.com-微信支付买足彩| www.788340.com-19052足彩推荐| www.957959.com-彩票业-| www.494365.com-沈阳彩票寻合作| www.306155.com-彩票01软件-| www.449136.com-大连福利彩票官网| www.584383.com-48彩票网址-| www.710154.com-互娱彩票-| www.59wm.com-体彩机押金好退吗| www.334449.com-福彩3d购买平台| www.498800.com-宝盈五分彩-| www.585276.com-彩神通3d家彩网| www.662292.com-三d中彩网-| www.745917.com-福彩抽奖是真的假的| www.000808.com-中国时时彩票| www.077578.com-今天七星彩奖表图| www.75660.com-彩票就是骗局| www.324835.com-彩票图表走势图大全| www.428722.com-种彩虹摇钱树| www.132721.com-世界杯竞彩推荐| www.22537.cc-爱米彩票真挣钱吗| www.877116.com-体彩排三规律速查表| www.059503.com-十年彩票平台| www.32wk.com-彩票过年休几天| www.506.vip-内蒙古体彩下载软件| www.96gr.com-万达玩彩平台| www.8278.cm-求娱乐彩票网站| www.495183.com-必中彩票网址| www.656600.com-北京体彩店转让| www.569234.com-手机网易彩票安全吗| www.633929.com-7彩酒店的英文| www.03636.com-七星彩如何打才赚钱| www.3025.top-金宝彩网站-| www.03478.com-兴盈快三-| www.40086.com-红彩彩票邀请码| www.000056.cc-海南4十1彩票图库| www.088199.com-福彩快三代玩骗局| www.55418.cc-正好彩票网11选5| www.069163.com-福建时时彩快3规则| www.136076.com-太子彩票网站| www.217685.com-彩客竞彩彩票app| www.290043.com-中彩网双色球字谜| www.368007.com-入门水彩画图片简单| www.475163.com-粤海彩票网高手料1| www.570949.com-钟嘉欣好彩妹图片| www.8447.cc-新星彩票app| www.064996.com-守信彩票网页版| www.133888.com-福彩3d2元走势图| www.209095.com-赢钱彩app-| www.283967.com-福利彩票有几位数| www.662779.com-众彩程远预测| www.080919.com-大吉彩票真黑| www.255730.com-快三不好怎么买| www.507821.com-新九州彩票快三| www.526796.com-澳客竞彩比分| www.620165.com-釉上彩画-| www.699724.com-彩票5官网-| www.780767.com-黑客攻击高频彩票| www.858446.com-福利彩世界邀请码| www.921371.com-甘肃体彩开奖| www.977843.com-纸箱彩印设备| www.pm.cc-福彩双色球走势图| www.970264.com-福彩61开奖规则| www.00er.com-形容彩虹的优美句子| www.961725.com-3d福彩图-| www.cai0999.com太多的江苏快三骗局| www.ny73.com-尊彩骗局-| www.05ao.com-竟彩足球比赛| www.88lx.com-临夏市福利彩票中心| www.179830.com-黑龙江快三走势图| www.309669.com-体彩7往数-| www.126111.com-亿发彩票平台可靠吗| www.165327.com-1068彩票登录| www.044593.com-快彩王app-| www.739397.com-竞彩网店地图| www.989135.com-这个体育彩票app| www.qk84.com-快三速查表和值| www.16ia.com-双彩论坛手机板| www.4027.cm-sb博彩公司全称| www.197202.com-乐彩心水-| www.265827.com-银川彩票在哪领奖| www.188533.cc-北京快三代理| www.539490.com-彩票机过户-| www.632779.com-豫彩通怎么买彩票| www.692095.com-彩票乐乐-| www.471789.com-都市彩票小说| www.579342.com-彩票网络平台| www.860590.com-快三开奖时间更改| www.55033.com-彩票托胆-| www.024301.com-腾讯分分彩刷量大底| www.018471.com-最高倍率彩票网| www.719971.com-彩票开奖几点不买了| www.916160.com-怎么代理彩票投注站| www.74732.com-金彩在线彩票怎么样| www.092581.com-时彩最牛技巧后一| www.170498.com-江西快三走势图今天| www.266477.com-福利彩票排7| www.341622.com-秒速快三计算公式| www.156410.com-香港好彩堂-| www.64462.com-体育彩票常见的数字| www.106621.com-瑞彩祥云如何作弊| www.235047.com-建行中彩啦-| www.03144.com-彩票怎么打出来| www.612665.com-d8购彩下载-| www.679721.com-鸿鼎彩票网站| www.265908.com-网上彩票诈骗套路| www.577082.com-天天彩选五开奖号| www.8360.com-海南七星彩系统| www.892302.com-福彩3地开机号| 500彩票www.50024o.com| www.809337.com-彩票周期一般多长| www.878299.com-北控国彩即开彩票| www.940069.com-休彩试机号-| www.991438.com-安微快三和值| www.cp3968.com-一分快三稳定计划|