QQ客服
当前位置 : 首页 > 代码 > 网页特效 > 选项卡/滑动门 > jQuery新零售产品系列滑动选项卡布局代码

原创商用 jQuery新零售产品系列滑动选项卡布局代码

jQuery新零售产品列表tab选项卡布局,悬停标签滑动切换选项卡代码。
分享到微信朋友圈
X
[声明]该素材是本站付费买断的作品代码,享受著作权?;?,未经允许请勿转载,否则追究相应的法律责任。

使用方法:

1、head引入css文件

<link rel="stylesheet" type="text/css" href="statics/css/iconfont/iconfont.css" />
<link rel="stylesheet" type="text/css" href="statics/css/style.css" />

2、head引入js文件

<script src="statics/js/jquery-1.11.0.js" type="text/javascript" charset="utf-8"></script>

3、body引入HTML代码

<div class="container">
	<h2 class="title">新零售系列产品</h2>
	<div class="desc">
		<strong class="color">新零售:</strong> 即企业以互联网为依托,通过运用
		<span class="color">大数据</span>、<span class="color">人工智能</span>等先进技术手段,对商品的生产、流通与销售过程进行升级改造,进而重塑业态结构与生态圈,并对<span class="color">线上服务</span>、<span class="color">线下体验</span>以及<span class="color">现代物流</span>进行深度融合的零售新模式 。<span class="color">线上线下和物流结合在一起,才会产生新零售。</span>
	</div>
	<div class="content">
		<ul class="product-tab">
			<li class="active">
				<img src="statics/images/product-icon1.png" /> 翼商城
			</li>
			<li>
				<img src="statics/images/product-icon2.png" /> 云ERP+收银狗
			</li>
			<li>
				<img src="statics/images/product-icon3.png" /> 云物流
			</li>
			<li class="line"></li>
		</ul>
	</div>
	<div class="product-list">
		<div class="product-item">
			<div class="product-desc">
				<h3>翼商城</h3>
				<p>智能电商生态系统,支持自营、招商、批发、区域等多模式运营,还可轻松对接物流、ERP、收银等周边系统,帮您打造智能新零售!</p>
				<a href="#" class="btn">了解详情 +</a>
			</div>
			<div class="icon-list">
				<ul>
					<li>
						<a href="#">
							<i class="iconfont"></i>
							<p>全国电商</p>
						</a>
					</li>
					<li>
						<a href="#">
							<i class="iconfont"></i>
							<p>连锁店</p>
						</a>
					</li>
					<li>
						<a href="#">
							<i class="iconfont"></i>
							<p>供应商</p>
						</a>
					</li>
					<li>
						<a href="#">
							<i class="iconfont"></i>
							<p>厂商/经销商</p>
						</a>
					</li>
					<li>
						<a href="#">
							<i class="iconfont"></i>
							<p>农村电商</p>
						</a>
					</li>
					<li>
						<a href="#">
							<i class="iconfont"></i>
							<p>生鲜电商</p>
						</a>
					</li>
					<li>
						<a href="#">
							<i class="iconfont"></i>
							<p>母婴电商</p>
						</a>
					</li>
					<li>
						<a href="#">
							<i class="iconfont"></i>
							<p>连锁超市</p>
						</a>
					</li>
					<li>
						<a href="#">
							<i class="iconfont"></i>
							<p>百货商场</p>
						</a>
					</li>
					<li>
						<a href="#">
							<i class="iconfont"></i>
							<p>其他行业</p>
						</a>
					</li>
				</ul>
			</div>
		</div>
		<div class="product-item hide">
			<div class="product-desc">
				<h3>云ERP+收银狗</h3>
				<p>云ERP+收银狗是SAAS型进销存与收银系统,以多商家入驻、加盟连锁为经营模式,涵盖平台方、商家、收银员等多种角色,进销存核心??榛坊废嗫???晌薹於越由坛窍低?,线上线下结合,实现电商实体一体化管理。<span>*加入商家QQ群大本营,一起交流运营心得吧,QQ群号:279730318</span></p>
				<a href="#" class="btn">了解详情 +</a>
			</div>
			<div class="icon-list">
				<ul>
					<li>
						<a href="#">
							<i class="iconfont"></i>
							<p>果蔬行业</p>
						</a>
					</li>
					<li>
						<a href="#">
							<i class="iconfont"></i>
							<p>餐饮行业</p>
						</a>
					</li>
					<li>
						<a href="#">
							<i class="iconfont"></i>
							<p>服装行业</p>
						</a>
					</li>
					<li>
						<a href="#">
							<i class="iconfont"></i>
							<p>商超行业</p>
						</a>
					</li>
					<li>
						<a href="#">
							<i class="iconfont"></i>
							<p>母婴行业</p>
						</a>
					</li>
					<li>
						<a href="#">
							<i class="iconfont"></i>
							<p>社区行业</p>
						</a>
					</li>
					<li>
						<a href="#">
							<i class="iconfont"></i>
							<p>五金建材</p>
						</a>
					</li>
					<li>
						<a href="#">
							<i class="iconfont"></i>
							<p>快餐外卖</p>
						</a>
					</li>
					<li>
						<a href="#">
							<i class="iconfont"></i>
							<p>咖啡行业</p>
						</a>
					</li>
					<li>
						<a href="#">
							<i class="iconfont"></i>
							<p>校园行业</p>
						</a>
					</li>
				</ul>
			</div>
		</div>
		<div class="product-item hide">
			<div class="product-desc">
				<h3>云物流</h3>
				<p>云物流系统以众包物流为主,自建物流为辅,实现类似滴滴打车的抢单配送。使用云物流系统既可以管理自己的配送团队,也可以整合发单商家和兼职配送人员。<span>*加入商家QQ群大本营,一起交流运营心得吧,QQ群号:292844176</span></p>
				<a href="#" class="btn">了解详情 +</a>
			</div>
			<div class="icon-list">
				<ul>
					<li>
						<a href="#">
							<i class="iconfont"></i>
							<p>水果店</p>
						</a>
					</li>
					<li>
						<a href="#">
							<i class="iconfont"></i>
							<p>便利店</p>
						</a>
					</li>
					<li>
						<a href="#">
							<i class="iconfont"></i>
							<p>蛋糕店</p>
						</a>
					</li>
					<li>
						<a href="#">
							<i class="iconfont"></i>
							<p>茶饮店</p>
						</a>
					</li>
					<li>
						<a href="#">
							<i class="iconfont"></i>
							<p>鲜花店</p>
						</a>
					</li>
					<li>
						<a href="#">
							<i class="iconfont"></i>
							<p>服装店</p>
						</a>
					</li>
					<li>
						<a href="#">
							<i class="iconfont"></i>
							<p>饭店</p>
						</a>
					</li>
					<li>
						<a href="#">
							<i class="iconfont"></i>
							<p>酒店</p>
						</a>
					</li>
					<li>
						<a href="#">
							<i class="iconfont"></i>
							<p>旅行社</p>
						</a>
					</li>
					<li>
						<a href="#">
							<i class="iconfont"></i>
							<p>更多行业</p>
						</a>
					</li>
				</ul>
			</div>
		</div>
	</div>
</div>
<script type="text/javascript">
	$(function() {
		// 产品tab切换
		$('.product-tab li').hover(function() {
			$('.product-tab li.line').stop().animate({
				'left': $(this).position().left
			});
			$('.product-list .product-item').stop().eq($(this).index()).show().siblings().hide();
		});
	})
</script>
[声明]本站素材来自用户分享,仅限学习交流请勿用于商业用途。如损害你的权益请联系客服QQ:2447402004给予处理。
举报×
举报原因:

相关代码

二维码
意见反馈
×
×

注册

QQ注册 立即下载 新浪注册 立即下载

签到成功!

已连续签到1天,签到3天将获得积分VIP1天

知道了
时时彩宝典 www.043237.com-哪里可以代买足彩| www.li05.com-中彩彩票怎么样| www.326022.com-彩经网排三胆码| www.85098.com-我附近的彩票店| www.688745.com-会员注册鸿鼎彩票| www.832256.com-福彩3d8卦图| www.994599.com-什么是彩票注数| www.pw97.com-彩票九下载-| www.166095.com-快三是什么-| www.839349.com-彩色耐磨地坪图片| www.949810.com-充值10送18彩票| www.cai130.com-湖北福彩快三查询| www.12300.com-竞彩推荐预测| www.254872.com-五分快三助手| www.826011.com-赛车彩票网-| www.813284.com-微信上让你玩彩票的| www.911672.com-乐彩vip下载| www.979333.cc-龙彩绘-| www.wy43.com-c8万彩吧cn-| www.js89.com-彩神vl是真的么| www.12ou.com-彩名堂官网网址| www.5083.top-购买世界杯足彩| www.25899.com-聚财彩票网可靠吗| www.3411.org-快三号码分折数据| www.760343.com-五星彩开奖结果查询| www.7yt.com-中国福利彩票计算机| www.981970.com-酷彩娱乐平台| www.160922.com-北京福彩联系电话| www.631775.com-七彩阳光小视频| www.75ot.com-古建彩绘文样| www.248574.com-福彩3d交流论坛| www.369751.com-三分时彩app| www.706926.com-时时彩平台代玩兼职| www.c44.net-360彩票预测| www.22618.cc-福彩3d全天计划群| www.3589.wang-电子棋牌送18彩金| www.ia76.com-彩票坊是真的假的| www.680897.com-福彩开奖链接| www.796403.com-刷彩挣钱可靠吗| www.878553.cc-综艺福彩网站| www.629385.com-任九胜负彩分析预测| www.7691.wang-彩票中奖多久能拿| www.34316.com-爱彩乐苹果版下载| 网易彩票www.069wy.com| www.603517.com-彩票安徽快3| www.009430.com-手机中彩靠谱不| www.081898.com-下载够力七星彩票| www.376908.com-北京娶媳妇有彩礼吗| www.349099.com-足球彩票代理| www.77978.cc-91彩站联盟app| www.063063.cc-竟彩比分直播| www.179085.com-快三毁人-| www.900761.com-久久彩票坑人| 51彩票www.956568.com| www.zv06.com-重庆时时彩官方投注| www.20sh.com-时时彩表格怎么看| www.8345.biz-局王七星彩图纸| www.91884.com-一举成名赢彩知| www.112533.com-福利彩票6十1| www.ry3.cc-福彩快三心态| www.890089.com-全名彩票app| www.990751.com-好彩票软件| www.hv88.com-北京体彩官网首页| www.115089.com-江苏省福彩兑奖中心| www.220036.com-快三走势图河北昨天| www.132176.com-起诉离婚退彩礼案例| www.748358.com-红彩app苹果版| www.024483.com-财富彩票是真的吗| www.118651.com-菲律宾做时时彩| www.021641.com-信博网彩票平台| www.910535.com-双色球快三玩法介绍| 600万彩票www.448910.com| www.442260.com-网易红彩怎么样| www.112651.com-七星彩查询开奖| www.108928.com-查彩票用哪个软件好| 彩票5www.550154.com| www.169976.com-快三吉林开奖| www.602422.com-彩票可以折叠| www.696022.com-6号平台彩票网址| www.782823.com-竞彩258怎么样| www.851560.com-手机购彩365| www.928661.com-完美彩票app下载| 网易彩票www.083wy.com| www.984052.com-老猫看彩3d断组| www.dq85.com-网上的快三能玩么| www.783846.com-金柯福彩3d-| www.071917.com-彩色透水混凝土配方| www.139797.com-下载竟彩足球| www.233851.com-燕赵福彩排列七| www.150494.com-开开彩乐app| www.621597.com-福彩选号客密| www.356416.com-新利快三最大遗漏值| www.492013.com-黑彩11选5爆冷号| www.572705.com-纲力彩芽-| www.680697.com-全民福彩骗局28| www.769411.com-为什么玩时时彩必输| www.848883.com-重庆时时彩宝典开奖| www.921128.com-神彩网app下载| www.983436.com-快三和值投注技巧| www.zv.com-中彩彩票是国家的吗| www.397913.com-昨晚开什么奖七星彩| www.78711.cc-乐彩论坏-| www.675960.com-彩票网提现-| www.778915.com-旺彩社区3d绕胆图| www.545845.com-福利彩票站申请条件| www.116884.com-体彩试机号及金码| www.233238.com-体彩北京单场官网| www.50hj.com-职业彩民-| www.vu12.com-惠民彩票注册邀请码| www.mq73.com-七开奖结果星彩| www.140376.com-北京快三晚上几点停| www.732763.com-南京体彩销售点| www.95856.com-彩票中心上班时间| www.7659.biz-彩票方格-| www.48483.com-竞彩猫ios版| www.39ui.com-百度彩票猜谜| www.977619.com-世界杯足彩竞猜| www.fi43.com-快三大小全天计划| www.425600.com-1050彩钢板板型| www.7pc.cc-中彩票是意外吗| www.83hs.cc-今日体彩排三字谜| www.3794.com-篮彩比分直播188| www.568120.com-中彩网站-| www.666909.cc-乐彩交流平台| www.775823.com-90彩票平台登陆页| www.893555.com-乐彩网官方快三| www.969927.com-有谁中过彩票的| www.dk7.cc-快三高手-| www.383844.com-喜盈盈彩票大厅| www.20874.com-彩神ix下载平台| www.52388.cc-天猫彩票稳赚不赔| www.57706.com-中彩计划盈利| www.221181.com-福利彩票软件靠谱吗| www.635072.com-七彩国际影城凯德店| www.760357.com-大发快三必中计划| www.512520.com-凤凰彩铅画-| www.968464.com-鲍彩票-| www.cai8455.com体彩开奖是多少| www.405786.com-金利丰彩票-| www.542633.com-山东七乐彩开奖结果| www.755150.com-福彩3d原创预测分| www.827527.com-内蒙古快三和值推荐| www.928309.com-趣彩彩票官网| www.995927.com-捷报足彩预测| www.gq64.com-新加坡好彩双爆珠| www.vi47.com-黑龙江福彩官网下载| www.51.la-六冠彩票网站怎么样| www.294333.com-玩彩票会被警察抓吗| www.363009.com-双色球彩票真伪| www.440184.com-大发快三投注计划| www.522695.com-彩票代理返点| www.743577.com-彩票中心主任犯罪| www.813156.com-四川省福彩快乐12| www.870061.com-江苏快三最长多少期| www.919733.com-那个彩票平台信誉好| www.965174.com-新手买彩票买什么好| 吉利彩票www.66376f.com| www.1922.com-福彩3d组选号码| www.670122.com-海南彩票七星彩论坛| www.494545.com-越南河内5分彩开奖| www.3875.cn-3d彩票和值表| www.27270.cc-幸运8五分彩规律| www.rx51.com-彩票曝光-| www.31ka.com-256时时彩-|