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.63416.com-365彩票群-| www.015950.com-3d彩票老店主| www.199381.com-吉林长春快三查询| www.289115.com-时时彩手机计划软件| www.40141.com-彩票网好提现吗| www.018339.com-大家赢彩票站地址| www.132084.com-订婚还彩礼-| www.234341.com-微信委托买彩票| www.774969.com-全天重庆彩万位计划| www.17sa.com-彩红代刷网快手| www.689977.com-500万足彩-| www.787922.cc-体彩十一选五任选一| www.76qx.com-七乐彩售卖时间| www.873166.com-58同城彩票app| 聚福彩票www.50989i.com| www.52275.com-安卓彩票app| www.020883.com-新浪彩票网站首页| www.111499.com-买彩票刷流水被骗| www.204438.com-恐龙快三-| www.284638.com-时时彩的玩法介绍| www.378214.com-好彩票幸运彩票软件| www.520347.com-特区七星彩纶坛下载| www.590880.com-体彩销售点怎么样| www.134710.com-体彩7位数中奖| www.221029.com-彩神争viii-| www.3826.org-七星彩四码万字表| www.18219.cc-福彩快三中奖有多少| www.98338.cc-玩分分彩的经历| www.069931.com-彩神app安全吗| www.166799.com-北京快三开奖视频| www.261517.com-易彩集团-| www.622443.com-上海体彩事件| www.741914.com-江苏快三心得| www.821023.com-彩色水泥价格| www.896116.com-合买彩票网站怎么买| www.991965.com-宜昌市体彩兑奖地址| www.5wi.com-时时彩源码出租| www.90tv.com-快乐彩选球技巧| www.4821.biz-淘宝购物彩票退货| www.800181.com-为何不能网购彩票| www.954452.com-浙江福利彩票网| 大赢家彩票网www.544096.com| www.vt93.com-腾讯彩票快三是真的| www.281474.com-福利快三中彩网| www.374898.com-天天爱彩票网站首页| www.502638.com-星际彩票平台合法吗| www.569039.com-重庆时彩开奖历史| www.2621.win-复式彩票计算| www.215156.com-旭彩美缝剂-| www.352965.com-福利福利彩票app| www.460006.com-彩票世界怎么下载| www.382753.com-体彩大乐透邢台中奖| www.553267.com-实体店能买足彩吗| www.700201.com-近期足彩开-| www.941289.com-彩票套利是怎么套的| 彩票58www.585560.com| www.mn21.com-时时彩四星走势图| www.07rc.com-上期彩票中奖| www.816172.com-福彩双色球奖金分配| www.466.live-石家庄市福彩中心| www.6863.top-浙江体彩飞鱼分析| www.27282.cc-七星彩彩票机选软件| www.543342.com-福彩一句子定三码| www.648234.com-曼德尔彩票公式| www.827888.cc-刷彩金赚佣金| www.922867.com-彩票代销证更改地址| www.987641.com-小米彩票官网登录| www.au85.com-内苎快三预测| www.672531.com-8彩软件-| www.882501.com-国家正规的高频彩票| www.030052.com-素描彩铅画图片大全| www.153589.com-时时彩预测大小技巧| www.622902.com-福彩3d1700-| www.718408.com-七星彩胆拖计算器| www.500788.com-彩票员工背叛11年| www.138254.com-手机版新彩网分析| www.250184.com-购彩网app-| www.316766.com-江苏快三口诀| www.395907.com-世界十大彩宝排行| www.559060.com-福彩体彩双机店转让| www.663807.com-越南彩票开奖| www.739794.com-快乐彩票网官方端口| www.821178.com-时时彩大牛在线计划| www.901018.com-3d天天彩图报纸| www.967584.com-迪拜彩票在哪里买| www.gz2.cc-安徽快三开奖遗漏| www.138476.com-日本彩票乐透6| www.568271.com-建盏为什么会出七彩| www.hw89.com-福彩快乐十分走试图| www.263897.com-彩票手机购彩app| www.461817.com-三地图迷总汇牛彩网| www.565579.com-不出本金代打彩票| www.654144.com-本期福彩二等奖号码| www.828567.com-奥地利彩票中最大奖| www.909360.com-彩吧3d谜图第五版| www.974315.com-五福彩分分时时彩| www.nn1.cc-湖北福彩-| www.ug10.com-106官方彩票| www.26iz.com-彩票开奖结果33期| www.12996.cc-福利彩票兑奖地址| www.99473.com-足球竞彩大师推荐群| www.195639.com-职业彩民心得| www.181999.cc-北京快三大小单双| www.270063.com-帝皇彩票下载| www.345147.com-彩票中奖在哪里兑换| www.412055.com-x原彩显示-| www.517318.com-高频彩网投平台| www.216108.com-福彩群英会-| www.301825.com-贵州快三走势结果图| www.385027.com-澳發彩app下载| www.579600.com-福彩网是干什么的| www.651856.com-彩票有多少年了| www.760043.com-全天在线时时彩计划| www.821111.com-我附近的福彩销售点| www.880842.com-8号彩票兼职| www.947714.com-众彩网知瞳专家预测| www.997654.com-体彩快中彩规则| www.br63.com-彩票中奖工具| www.xj03.cc-好彩3中奖规则| www.29hs.com-彩票平台哪里找| www.574777.com-乐彩vip邀请码| www.672115.com-三d风云彩票| www.749144.com-休育彩票31选7图| www.830529.com-怎样用手机查彩票| www.900422.com-精彩爆米花表情包| www.966809.com-体彩多少天兑奖| www.cai0299.com彩票选号助手| www.37317.cc-俄罗斯彩蛋-| www.980307.com-下载买彩-| www.cp7977.com-江苏快三是骗人的吗| 68彩票www.68689p.com| www.35379.cc-体彩是否有假| www.73nr.com-买什么彩票才能中奖| www.2339.com-凤凰彩票安全可靠吗| www.9945.online2018彩礼-| www.590762.com-七x4cc天下彩票| www.673579.com-祠堂彩绘图案| www.755389.com-3d之家彩吧网| www.957498.com-连中彩票ios| www.997744.com-一分快三赢钱技巧| www.ai26.com-查一下福利彩票号码| www.vh94.com-网上彩票正规平台| www.4032.cc-足彩十四场开奖| www.01357.com-足彩必发交易指数| www.074339.com-石家庄拓彩美缝剂| www.132287.com-河南濮阳彩礼多少钱| www.274646.com-时时彩就是坑| www.337220.com-湖北快三组合分布| www.396321.com-博友彩网站-| www.511255.com-用彩虹起一个网名| www.565308.com-跑马福彩赛马| www.618914.com-明天3d彩票开结果| www.673276.com-七星彩巨奖排名| www.732667.com-希望手游彩票官网| www.792574.com-彩票能跨省领奖吗| www.867581.com-昨天开什么奖七星彩| www.913016.com-体彩三地开奖结果| www.964846.com-浙江体彩怎么下载| www.am31.com-福彩河北基本走势| www.xl23.com-鑫彩网能提现吗| www.153565.com-k彩一彩民中奖福地| 网易彩票www.070wy.com| www.jf30.com-彩票快3表-| www.t79.club-购采大厅网上买彩票|