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天

知道了
1分快三 www.nf69.com-江苏快三怎么买| www.771987.com-福利彩票5d开奖| 亚洲彩www.68568a.com| www.224.cm-彩票有发票吗| www.199133.com-滴滴彩票提现不了| www.433438.com-彩票一等奖中奖地区| www.897069.com-竞彩足彩500网| www.lw96.com-福建省福彩快3| www.1794.xyz-福彩3d彩吧论首页| www.387923.com-下彩老版本-| www.t00.cc-贾峪彩票中奖| www.t32.net-能合买的彩票| www.9299.pw-彩票每天有人倍投吗| www.307299.com-爱彩乐算什么彩票| www.551251.com-顺发彩票app| www.739389.com-体彩编号-| www.612230.com-万彩吧3d开奖| www.090001.com-中国福利彩票有假吗| www.652896.com-澳门博彩有限公司亚| www.737816.com-购乐彩合买大厅| www.810007.com-中奖号码查询彩票| www.891791.com-熊猫时时彩qq群发| www.984828.com-彩票网有风控审核吗| www.br62.com-幸运快三投注规律| www.365380.cc-七彩大乐透彩票| www.560428.com-红彩会彩票app| www.980619.com-彩票站怎么加盟| www.7883.cc-高频彩票助手软件| www.877873.com-重生之中彩票人生| www.v72.club-牛彩网摘彩网| www.791002.com-福彩选号助手好用吗| www.017649.com-最高倍率彩票| www.92eu.com-体彩大乐透中了前区| www.635853.com-宝乐彩票app| www.615262.com-美狮彩票下载| www.733055.com-南京市体彩中心主任| www.878287.com-手机彩票500网| www.zo89.com-赢钱彩-| www.550266.com-江苏快三网上卖| www.632253.com-566彩票下载| www.717936.com-彩虹有哪几种颜色| www.646.website分分彩输死了| www.95523.cc-足彩直播视频| www.087072.com-乐福彩-| www.175675.com-安徽快三遗漏一定牛| 天下彩www.451770.com| www.509570.com-盈彩网app邀请码| www.cai32.com-精彩十分开奖结果| www.3636.biz-彩票是怎么开奖的| www.252879.com-体彩打票员怎么对账| www.877055.com-福彩4码最大遗漏| www.977540.com-吉利彩票官网| www.cp532.com-大发快三提现不了| www.mq88.com-网络福彩3d骗局| www.896838.com-彩票挂机哪个好| www.323981.com-马来西亚做博彩工作| www.cp6627.com-一分快三技巧和值| www.625729.com-资深的彩票销售平台| www.742095.com-云来彩票版-| www.912286.com-买彩票犯法吗知道吧| www.hs46.com-百盈快三破解器| www.393493.com-今晚上福彩出什么号| www.0804.com-足彩网购恢复| www.4890.hk-彩票竞猜夹娃娃| www.783799.com-038彩时时彩| www.952831.com-浙江体彩大乐透开奖| www.is73.com-头奖彩票吧-| www.3831.top-体彩第19036期| www.8743.vip-明发彩票怎么样| www.780501.com-app28送彩-| www.945233.com-大连买彩票几点截止| www.992901.com-新疆喜乐彩开奖信息| www.cc06.cc-快三开奖助手甘肃| www.ka17.com-新宝彩票下载| www.14aa.com-福彩3d杀戮数| www.68300.com-今日彩票幸运号码| www.177577.cc-快三在线人工计划网| www.5454.win-3d福彩速查表| www.37985.com-体彩排列三图谜总汇| www.1695.net-天涯时时彩论坛| www.019349.com-贵州省彩票兑奖中心| www.697721.com-时时彩和值大小玩法| www.796012.com-优盈彩票app| www.883425.com-安徽快三出豹子征兆| www.947614.com-湖南彩票论坛| 福彩www.15355x.com| www.tz48.com-七星彩术语大全| www.29po.com-荷花水彩图片| www.862.online-时时彩6码后二方法| www.00638.com-彩票销售点有钱挣吗| www.011636.com-彩票可以网上买吗| www.151458.com-精彩网彩票下载| www.055344.com-彩票中奖符头像| www.067110.com-大地彩票好不好提现| www.127545.com-彩虹六号买哪个版本| www.207028.com-七乐彩票平台可靠吗| www.268989.com-珠江彩票能玩吗| www.331079.com-彩票棋牌一体平台| www.397621.com-福彩图谜牛彩网| www.506066.com-湖北快三加奖公告| www.490250.com-福彩一九3d图库| www.679245.com-彩票会死人-| www.904779.com-中中国体彩官网| 500彩票www.50024f.com| www.068229.com-彩名堂ios下载| www.195975.com-福彩助手是正规的吗| www.334449.com-福彩3d购买平台| www.456213.com-彩票机会打法| www.26us.com-彩票中了几十万| www.982802.com-湖南福彩网网| www.ug2.com-足彩8串1-| www.111905.com-手机购彩软件安全吗| www.239756.com-王者彩票网站| www.312478.com-e球彩奖金表| www.399200.com-七星彩坛论头尾| www.523467.com-呼市福利彩票快3| www.586486.com-人人中彩票网手机版| www.653759.com-澳门彩票可以买吗| www.715003.com-瑞彩网骗钱-| www.820605.com-七星彩直播结果| www.922957.com-体彩开店-| www.980466.com-贵宾室彩票软件下载| www.cp0900.com-手机彩票软件| www.jw66.com-有人破解过彩票吗| www.t55.xyz-118彩票安装苹果| www.74hc.com-排列三天吉彩票| www.0592.la-福彩3d怪字神贴| www.00757.com-福彩3d村黄金蛋吗| www.050006.com-黑彩庄家稳赚不赔吗| www.210719.com-合肥彩票-| www.376225.com-咸阳立彩公司| www.508279.com-玖富彩票六肖十二码| www.569256.com-福彩快三和值走势| www.623733.com-港澳彩网-| www.686817.com-中彩的那天全文| www.739701.com-苹果彩票pg73| www.28ta.com-258竞彩篮球论坛| www.486364.com-足彩半全场中奖规则| www.557773.cc-幼儿游戏彩虹伞音乐| www.633989.com-银川七彩艺校| www.692882.com-彩神国际正规吗| www.751742.com-一宵中彩-| www.801852.com-福彩双色球投注手机| www.863262.com-19041期胜负彩| www.909642.com-体育彩票提成怎么算| www.964218.com-福彩官网开奖号码| 中国彩票网www.zg39.com| www.47625.com-蓟彩芝电视剧有哪些| www.89724.com-彩票游戏平台手机版| www.486364.com-足彩半全场中奖规则| www.550974.com-彩票合买机会多吗| www.599165.com-名豪彩票平台正规吗| www.655769.com-m8彩票平台官网| www.712513.com-网赌江苏快三| www.782377.com-重庆1.5分彩| www.836354.com-好彩三万能码| www.885508.com-新利彩票平台合法吗| www.942244.com-彩96注册娱乐网址| www.979696.com-好彩一预测彩彩乐| 幸运彩票www.807266.com| www.607626.com-买彩票截止到几点| www.693307.com-国际彩票网站| www.770071.com-七彩云南普洱茶| www.825375.com-广州鸣彩客服|