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天

知道了
彩01彩票 www.332294.com-买彩票一张多少钱| www.5234.pw-博彩派彩是什么意思| www.83799.com-彩票代理靠什么赚钱| www.999327.com-e球彩三场全包奖金| www.183115.com-快三客软件-| www.lr86.com-中彩在线能提现吗| www.813996.com-彩吧图迷第044期| www.397615.com-彩票字迷牛材网| www.611667.com-彩票站点缴费| www.739984.com-彩票3d走势图下载| www.867288.com-快三自动-| www.970958.com-全天彩是正规的吗| www.aq5.cc-河北快三豹子统计| www.57pn.com-体彩大乐透后一位| www.128386.com-彩研师荐双色球| www.237897.com-福彩选号助手下载| www.616828.com-四季彩注册账号| www.211474.com-彩客站是不是骗局| www.333463.com-体彩怎么买法| www.4602.cc-一般买什么彩票好| www.73191.cc-彩票查寻结果| www.8gh.com-破解七星彩软件下载| www.2799.me-百事可乐彩票网| www.9361.wang-百乐城彩票-| www.967148.com-彩票守号技巧| www.89932.cc-竞彩足比分直| www.398573.cc-首存送彩金的网投| www.550851.com-合买彩票合法吗| www.627590.com-帝王彩平台-| www.451265.com-c彩16官网下载| www.571390.com-华人彩官方网站| www.534325.com-电玩城彩票机技巧| www.863590.com-黑客更改彩票余额| www.890750.com-至尊彩一-| www.969626.com-什么彩票软件最好用| www.cq04.com-警察抓时时彩代理| www.3311.ren-彩神之首专家专栏| www.06897.cc-今天双彩球-| www.81js.cc-七乐彩中奖率低| www.cp3455.com-河南快三投注技巧| www.9621.org-天天彩票高手网| www.lm1.com-彩票app排行榜| www.419448.com-m彩色香烟图片| www.63052.com-彩票兼职可信吗| www.405565.com-体彩总进球数| www.280088.com-时时彩在线预测器| www.365707.cc-体彩排列五推荐号| www.474344.com-福彩排列5几点开奖| www.575733.com-九九彩票旧版| www.806319.com-快三开奖50走势| www.916147.com-彩票坐庄机器人| 九九集团www.99jti.com| www.115986.com-彩75彩票-| www.707695.com-彩票号码历史开奖| www.92349.com-中原福彩开奖结果| www.234114.com-安徽福彩领取| www.638223.com-竟彩是合法的吗| www.753508.com-哪种彩票真实性高| www.855914.com-吉祥彩票网-| www.925108.com-微信怎么购买彩票| www.984831.com-彩票幸运选号中大奖| www.dv63.com-福彩网app-| www.975633.com-湖南长沙福彩中心| www.rx88.com-淘宝怎么买彩票| www.92bt.cc-七乐彩独胆汇总预测| www.6669.live-91彩票新平台| www.972136.com-383博彩-| www.cp218.com-4s彩票藏宝阁| www.or28.com-优彩彩票手机版| www.s42.in-体彩查询中奖| www.49er.cc-摘彩虹冰淇淋| www.809405.com-955彩票ios-| www.db26.com-开彩票店-| www.76zj.com-福利彩票如何分析| www.16521.cc-时时彩全天连中计划| www.yl.cc-北京快三开奖信息| www.jq12.com-五分快三是骗局吗| www.292902.com-快三投注计算| www.784444.com-网络售彩何时开启| www.905618.com-彩乐乐专家杀码预测| www.308406.com-万彩吧高手计划| www.465316.com-足彩最多能买多少钱| www.637848.com-福彩内部电话| www.954243.com-大红鹰彩票网| 华人彩票www.hr5888.com| www.zs0.com-吉林快三遗漏| www.669824.com-彩王争霸彩票| www.855556.cc-福彩奖金计算器| www.71140.com-体育彩票考试知识| www.508843.com-彩铅荷花图片| www.101538.com-立彩助手评价| www.z92.club-李彩潭哪部最露| www.855617.com-程远彩票专栏| www.907411.com-彩票黄金分割应用| www.962764.com-彩神1.98邀请码| 3668彩票www.3668y.com| www.862139.com-体育彩票中了奖号码| www.215700.com-七星彩玩游戏| www.756466.com-908彩票-| www.862499.com-彩票开奖昨天| www.941449.com-怎么寻找彩票客户| www.985405.com-足彩返还率怎么看| www.35287.cc-章鱼彩票交流群群号| www.3788.win-福利彩报图-| www.305109.com-福彩34期-| www.043039.com-足球彩票买不了| www.134818.com-彩金彩票app| www.261712.com-澳客网竞彩胜平负| www.551985.com-周四开啥彩票| www.697261.com-天空与彩票网站| www.846508.com-小崔说彩票的真实性| www.119014.com-福利彩票是什么| www.717739.com-彩票平台套利| www.810171.com-彩乐网手机网址| www.290096.com-内蒙快三奖金| www.365107.cc-风之彩app-| www.472243.com-糖果彩螽值得养吗| www.550182.com-6678彩票主页| www.606390.com-q彩链接-| www.8578.top-腾讯彩票是什么| www.054291.com-大发快三和值推荐| www.5666.biz-网上怎么买彩票手机| www.11157.com-76c彩票-| www.52290.com-幸运中彩票安卓版| www.92112.cc-手机顺风彩票| www.262179.com-快三有作弊软件吗| www.801732.com-福彩一体机设置| www.kf3.cc-江苏快三预测推荐| www.0724.date-彩票店套利-| www.5bl.com-天津福彩兑奖处| www.29iq.com-彩票王成周后来| www.2972.wang-甘肃省福彩网| www.td25.com-彩票国彩-| www.dc09.com-311亿彩票-| www.027164.com-彩票专营店-| www.co23.com-福彩玩彩老头网站| www.357287.com-时时彩绑定送彩金| www.5006.org-大有彩票注册网址| 亿彩堂www.87668z.com| www.gi21.com-快三走势图江苏| www.8mp.com-快乐彩票klcp| www.88zz.com-热购彩票技巧| www.5174.biz-大白菜彩金-| www.11790.com-彩神v注册码| www.74yl.com-体彩怎么看中奖号码| www.060881.com-掌上购彩官网| www.149969.com-掌优彩票app下载| www.238122.com-体育彩票兑奖流程| www.639504.com-苏宁竞彩-| www.86068.com-彩合钢板-| www.035628.com-快三qq稳定群| www.126619.com-印尼五分彩开奖| www.188380.com-安徽快三群骗局揭秘| www.252121.com-旺彩大师软件下载| www.22513.com-齐鲁风采彩票不带0| www.77144.cc-竞彩任选九玩法| www.091739.com-体彩彩票骗局| www.289762.com-福彩三d字谜总汇| www.390583.com-分分彩如何稳赢| www.1923.top-bb彩票-| www.41186.com-网上买彩票官方网站| www.009600.com-987彩票app-| www.123518.com-彩票和双色球的区别| www.234641.com-有福利彩票app吗|