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.36353.cc-彩票3d走势图表| www.383656.com-今天晚上福彩| www.203519.com-体彩5d的开奖结果| www.33181.com-3d彩保网首页| www.111302.com-易彩网广西快3开挂| www.081063.com-彩票老师一对一| www.847121.com-体彩大乐透八等奖| www.177993.com-北京快三结果| www.691151.com-87彩票店铺邀请码| www.783642.com-万达彩票app下载| www.895400.com-中体华彩合法吗| 91彩票网www.912482.com| www.2130.live-图谜总汇牛彩| www.4132.cc-广西福彩七彩乐开奖| www.48166.com-哪个彩票网站能买| www.b30.cc-福彩双色球字谜总汇| www.2023.net-快三买单双-| www.804858.com-彩虹的小符号| www.922503.com-怎么当足彩分析师| www.ca82.com-彩票中奖神器下载| www.5388.vip-彩票777什么网站| www.963172.com-彩票顶呱刮平台| www.cj84.com-福彩三d藏机图| www.78665.cc-杨震足彩新浪专栏| www.629975.com-彩票65期-| www.8161.cc-梦到彩票号码解梦| www.349707.com-网上彩票违法吗| www.449993.com-中国体彩中心地址| www.6671.cc-上海时时乐开门彩| www.32518.com-河南焦作市结婚彩礼| www.2976.xyz-特区七星彩彩票论坛| www.9509.cn-海南七星彩网投| www.378.date-福彩如何算中奖| www.4238.vip-七彩视界下载安装| www.5718.in-附近福利彩票站位置| www.170414.com-快三走势图吉林省| www.290172.com-大赢家网站彩票| www.982480.com-吉林快三摇奖现场| www.gm60.com-河南快三必中技巧| www.xv96.com-澳发彩票网站| www.42kv.com-彩管家ios下载| www.976599.com-四川宜宾目前彩礼| www.cp5868.com-微信买彩票合法吗| www.17708.cc-胜负彩十四场对阵表| 爱彩www.235693.com| www.nq88.com-内蒙古体育彩票| www.21rd.com-288彩票下载| www.461.loan-3d杀号定胆彩票| www.4398.cn-中国福彩安卓版下载| www.212626.com-私彩平台赚钱套路| www.003508.com-网上彩票在哪里买| www.127365.com-彩客网比分直播版| www.149949.com-掌中彩正规吗| www.316679.com-快三挣钱方法大全| www.671661.com-6合和彩资料论坛| www.759781.com-福彩3d谜底图| www.833333.com-福利彩票自选怎么买| www.899023.com-北京体彩中心地址| www.961147.com-竞彩网一定牛| 盛彩网www.41518g.com| www.gt89.com-广西快三奖金图片| www.we81.com-彩13官网-| www.713999.com-数字型彩票分析方法| www.055606.com-中国体彩规则| 爱米彩www.am6633.com| www.916785.com-守信彩票网页版| 126彩票网www.295126.com| www.436543.com-山西运城体彩| www.4114.vip-七星彩局王奖表下载| www.127394.com-彩客网竞彩足球| www.54449.cc-时时彩如何做到稳赢| www.024362.com-手机彩票500网| www.153129.com-彩吧vip怎么样| www.269078.com-体彩排列三出奖号| www.285098.com-凤凰彩票战狼计划| www.81661.cc-买高频彩票是赌博吗| www.923990.com-6亿彩票-| www.53vn.com-大众网彩票游戏规则| www.96ql.com-彩票平台首充送彩| www.222153.com-福利彩票解密| www.412332.com-中国福利彩票计划王| www.111459.com-彩票团队计划大全| www.870082.com-足彩骗局-| www.775570.com-国民彩票-| www.253563.cc-彩之家网址g| www.498549.com-彩票计划群犯法吗| www.6263.net-运彩网下载-| www.047900.com-咋样买彩票-| www.5408.vip-中彩官网代理| www.51802.com-牛蛙彩资料-| www.985594.com-28彩票官网-| www.850069.com-大同订婚彩礼怎么给| www.30zp.com-彩虹代刷网搭建| www.310307.com-新浪竞技风暴彩票| www.491304.com-2个平台对刷彩票| www.45ac.com-做彩票代理-| www.365373.cc-v8彩票注册彩| www.571985.com-8888彩票pk拾| www.6472.com-福彩3d1000注| www.557731.com-彩票号码缩水软件| www.332882.com-福利彩票怎么查中奖| www.541002.com-广西快三走势图软件| www.ws35.com-彩票精准计划软件| www.480804.com-移动彩云官网| www.041099.com-彩票赚钱软件下载| www.126626.com-微信彩票群骗局揭秘| www.778893.com-深圳体彩中心官网| eight:28px}@mediaonly体彩快3走势图screenand(max| www.41bk.com-49彩票有带玩的吗| www.005589.com-时时中彩票下載| www.652187.com-黄金8五分彩app| www.799053.com-怎么买电竞彩票| www.947554.com-买彩票概率计算| www.ng9.com-传统一分快三走势图| www.04qe.com-先学线描还是彩铅好| www.091800.com-248彩票最新| www.526379.com-七星彩私彩缅甸做庄| www.438602.com-分分彩杀号大全| www.919721.com-微微彩票是干嘛的| www.34vo.com-第35期七星彩| www.748253.com-淘彩吧app-| www.896579.com-福彩v-| www.949753.com-中华彩票手机版| www.995264.com-英国五分彩开奖记录| www.je.com-极速快三彩票平台| www.69758.com-火箭少女彩票app| www.706633.com-嘉兴福彩店电话查询| www.013332.com-南国体彩论坛4十1| www.421650.com-体彩南宁奖-| www.666527.com-九州彩票提现不到账| www.835565.com-彩名堂旧版本下载| www.mu57.com-天天中彩彩票下载| www.1762.cc-爱购彩票是骗人的| www.38972.com-中彩官网快3| www.078929.com-体星彩7开奖结果| www.c16.com-易彩娱乐测速| www.317585.com-可以做职业彩民吗| www.478481.com-怎么样是足彩双平| www.659264.com-全国中奖彩票| www.674811.com-国家要取缔快开彩票| www.855266.com-凤凰彩票手机版| www.21979.cc-约彩365下载官网| www.28193.cc-美国高频彩票| www.397395.com-彩票快彩脚本| www.972219.com-彩票网站违法吗| www.25110.com-彩铅品牌排行榜| www.495605.com-mac博彩公司| www.037505.com-超级彩票-| www.113908.com-金凤凰彩票正规吗| www.336975.com-更好的体彩官网| www.462226.com-开黑彩店赚钱技巧| www.628956.com-诚信彩app下载| www.35868.com-头彩票手机版下载| www.752129.com-网易彩票能提现吗| www.129.in-体育彩票哪个好| www.083.cm-福利彩票几点停购| www.8if.cc-足彩最新开奖论坛| www.026080.com-9购10分彩-| www.691281.com-青海福彩3d微信群| www.762925.com-全民赢彩票骗局| www.819762.com-彩票哪里买哪里兑奖| www.876038.com-快乐彩票是正规的吗| www.924568.com-世纪佳缘上说买彩票| www.973609.com-陕西枫安快三查询|