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.94gu.com-易彩真的假的| www.h37.org-彩开奖号码-| www.006493.com-河内五分彩官方开奖| www.172691.com-至尊快三彩票| www.146031.com-699彩票苹果版| www.313625.com-用您ip代玩彩票| www.509252.com-分分时时彩规律| www.734575.com-下载多乐彩走势图| www.911057.com-怎样买福利彩票赚钱| www.ei65.com-江苏快三宝典| www.072037.com-彩票店几点营业| www.179792.com-七星彩玩法介绍| www.258671.com-提款安全彩票平台| www.3235.biz-深圳体彩举报电话| www.985879.com-3b彩报中心-| www.ct43.com-私彩代理提成| www.638020.com-彩八仙官网-| www.00800.com-广东体彩十一选5| www.055583.com-彩票分为哪几种类型| www.213757.com-彩神论坛-| www.oh.com-vip+168彩票| www.886536.com-福彩幸运快3平台| www.223096.com-福彩3d和值分布图| www.32768.com-全民汇彩票怎么样| www.87999.cc-三分钟时时彩走势图| www.798685.com-极速彩走势图| www.599303.com-买彩票中两万| www.755418.com-旺彩推荐累计中奖| 手机购彩www.715699.com| www.07pv.com-买重号彩票-| www.wj78.com-世界杯彩票-| www.836767.com-727彩票-| www.9185.name-彩票网站送活动| www.203556.com-广西快三跨度走势图| www.71604.com-福利彩票快三改| www.152406.com-百家彩娱乐注册| www.254735.com-彩之家-| www.ki9.com-彩票快三甘肃开奖| www.271848.com-湖北福彩30选5| www.173663.com-江苏快三开奖走势| www.283611.com-七星彩中5个数有钱| www.8vh.com-江苏体彩助手app| www.95289.com-七乐彩选号方法| www.335643.com-红中彩票手机版| www.511418.com-彩虹别名-| www.635532.com-彩票交税多少| www.cai6787.com快三技巧与规律| www.068415.com-福彩快三盈利| www.675797.com-彩票中奖三等奖| www.268185.com-湖北快三走势图| www.760103.com-体彩七位数中奖查询| www.654825.com-有没有彩票软件| www.761309.com-陕西省体彩中心电话| www.823363.com-彩铝板-| www.887330.com-下彩网彩票时时彩| www.952509.com-时彩在哪玩-| 体彩网www.3890p.com| www.kj60.com-易彩快3开奖号码| www.zc33.cc-福彩体彩当期开奖号| www.39ym.com-菲律宾彩票包网服务| www.211.tv-彩吧平台-| www.3446.com-买彩票赊账-| www.226102.com-天天乐彩-| www.318169.com-网上赌十字彩| www.125127.com-光头强买彩票69期| www.218837.com-彩票代理拉人话术| www.304938.com-福彩3d2元网杀号| www.025751.com-内蒙福彩在哪下载了| www.2017.me-快三彩票破解方法| www.226491.com-激励人买彩票的句子| www.926949.com-达人彩票靠谱么| 网易彩票www.560693.com| www.62624.cc-吉祥彩票入口| www.996551.com-快乐彩12开奖号码| www.d81.cc-彩z网-| www.532695.com-无惨三国星彩中| www.673561.com-古建彩绘分哪几派| www.cp074.com-安微快三综合走势图| www.388630.com-线上彩票为什么被禁| www.01ee.com-福利彩票有人中过么| www.3099.net-体彩3历史开奖号码| www.520097.com-成都体彩合买| www.881537.com-外国足球职业博彩人| www.966338.cc-福彩帮投跟单| www.cp912.com-湖北快三中奖查询| www.vh70.com-体彩三一-| www.5955.date-附近的体彩店在哪里| www.431722.com-91彩站联盟官网| www.1989.blue-江苏快三能提现吗| www.837977.com-复式彩票多少钱一张| www.61601.com-柬埔寨博彩客服| www.74ln.com-万彩双色球预测| www.284552.com-彩票站行情-| www.873978.com-彩票计算器双色球| www.4949.pw-中彩国际是真的吗| www.15391.com-嘉兴福利彩票| www.59519.com-江西快三的平台| www.639305.com-体彩店加盟的app| www.256564.com-官方彩网页-| www.58432.com-君彩时时彩-| www.057914.com-彩票快三中了多少钱| www.125977.com-彩票巴巴app| www.qm09.com-希腊5分彩开奖| www.10mt.com-汪汪时时彩app| www.270699.com-心心彩票app| www.7968.net-澳门理工博彩学院| www.530965.com-时时彩大概率平刷法| www.zr20.com-万达大玩家彩票| www.38676.com-乐中彩票app下载| www.tk59.com-酷彩网登录-| www.27wz.com-三彩蒸蛋-| www.696077.com-竞彩十四场开奖| www.996182.com-足彩开奖结果及奖金| www.143817.com-乐八彩票网址| www.603550.com-怎么下载688彩票| www.078963.com-七星彩复式计算器| www.180891.com-昨天快三走势图| www.255955.com-休闲快三慢动作| www.128655.com-五星彩下载安装| www.986904.com-彩富网资料大全| www.bu25.com-彩票46-| www.wy31.com-彩票预测系统app| www.13bp.com-中赢时时彩平台| www.76zd.com-福利彩票刮刮乐秘诀| www.1998.wang-慧金彩ios-| www.93430.com-齐鲁风彩-| www.cw6.com-彩票宗旨-| www.404585.com-体彩周二开什么| www.553762.com-竞彩严明明推荐| www.621971.com-天天大奖彩票站| www.697863.com-全民平台彩票可靠吗| www.765048.com-808福彩下载地址| www.839330.com-竞彩网论坛-| www.926632.com-彩票后面中两位数| www.976851.com-河南发布彩礼标准| www.bn2.com-湖北快三时间| www.178627.com-中国福利彩票软件| www.391164.com-彩票胆拖样板| www.208620.com-河北快三开奖今天号| www.al97.com-福彩3d组三胆拖表| www.qb34.com-新彩网下载-| www.351195.com-买福利彩票时间表| www.5424.pw-太原彩钢板厂家| www.60135.com-彩票中多少钱要交税| www.022940.com-彩票源码出售| www.101938.com-彩神网页-| www.273261.com-福彩与慈善的关系| www.333864.com-美国彩票规则介绍| www.389056.com-彩8彩票领导者| www.529032.com-易彩乐福利彩票| www.602076.com-彩票包赢-| www.673528.com-甘肃省体彩在哪| www.740112.com-博彩平台制作公司| www.808520.com-足彩最新对阵表推荐| www.879335.com-深圳福利彩票| www.938809.com-亿彩是不是骗局揭秘| www.983147.com-竞猜足彩app| www.vg66.com-可靠的彩票平台制作| www.11vw.com-彩票彩八下载安装| www.183073.com-大发快三走势图官网| www.242635.com-彩9彩票-| www.320552.com-百宝彩票平台| www.371911.com-游戏厅彩票能换币吗| www.448226.com-福彩3d预测最|