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.895531.com-2343cc天彩下| www.243689.com-湖北福彩官方网站| www.801074.com-购彩软件骗局| www.964388.com-竞彩足球手机怎么买| www.ko42.com-足球竞彩新浪爱彩| www.0222.me-玩彩输了一万| www.623013.com-湖南彩票-| www.850036.com-腾讯分分彩中三技巧| www.pv19.com-彩票倍投砍龙| www.523.mobi-崂山区体彩办| www.46912.com-超级时时彩是骗局吗| www.14vw.com-七里彩上官燕| www.473542.com-江苏福彩大厦| www.017812.com-大走势图乐彩走势图| www.789124.cc-订婚彩礼怎么退| www.892369.com-彩票榜官网登录| www.961353.com-百事彩票网址| www.av69.com-怎么分析彩票走势图| www.02ps.com-全球彩票骗局吗| www.hw36.com-彩票天天乐平台| www.4346.vip-四川绵阳福彩网| www.51163.cc-彩之源骗局-| www.057983.com-彩票走势首页| www.179197.com-安徽省快三走势图| www.64898.com-碧彩ii800校称| www.086004.com-麒麟彩票提现不了| www.201058.com-福彩快三专业版下载| www.273935.com-时时彩二星跨度| www.722369.com-体育篮球彩票怎么玩| www.492510.com-如何攻击黑彩网站| www.020679.com-今天3d彩民乐| www.837693.com-重庆时时彩的套路| www.015914.com-彩库宝典开奖app| www.142543.com-彩运网cy78-| www.664671.com-七乐彩现厂直播| www.745800.com-下载手机天天中彩| www.812611.com-最新的彩票书籍| www.880697.com-体彩五的开奖结果| www.948601.com-彩票刮刮卡中奖秘密| www.998061.com-北京彩票体彩| www.co36.com-彩客网提款提不出| www.178667.com-e球彩-| www.2fa.com-时时彩平台有哪些| www.047556.com-百宝彩票网图表中心| www.81121.com-全民彩票用户注册| www.033654.com-下载易彩网站| www.96509.com-竞彩彩票停了| www.180311.com-福彩快三开奖查询| www.754577.com-彩博app苹果版| www.587019.com-利鑫彩票平台代理| www.699760.com-七星彩册子彩界纵横| www.774569.com-永利彩票网-| www.845685.com-订婚彩礼钱怎么退| www.965540.com-新北京快三-| 鑫彩网www.xcw866.com| www.872092.com-彩票达人中奖秘密| www.9352.xyz-新快报福彩票| www.403055.com-038彩票最新彩娱| www.505833.com-黑彩平台怎么举报| www.576645.com-购彩v下载安装| www.423043.com-七星彩单期走势图| www.935234.com-cp121彩票走势| www.j36.me-彩票下注平台| www.293137.com-幸运彩幸运二任选| www.681.in-时时彩公司-| www.7452.vip-彩票走势图游泳| www.rq47.com-5分钟开一期的彩票| www.46169.com-555c彩票-| www.021104.com-老张说彩双色球| www.5428.org-吉祥彩票平台真的吗| www.13397.cc-足彩8x70-| www.56793.cc-时时彩龙虎具体玩法| www.024631.com-省福利彩票事业编| www.177275.com-河南今曰快三走势图| www.15773.cc-零基础学彩铅入门| www.183600.com-掌上中彩彩票| www.r10.in-七星彩每注多少钱| www.79jr.com-彩票有中了的吗| www.688742.com-手机如何买3d彩票| www.790611.com-南方双彩双色球预测| www.868629.com-七星彩45-| www.944470.com-体育彩票杀号机选| 大赢家彩票平台www.962779.com| www.6918.com-优彩彩票能提现不| www.09lq.com-看彩啦3d今天图| www.520987.com-必发彩票是非法| www.664532.com-七乐彩比较器| www.cp2806.com-福建快三开奖一定牛| www.32fe.com-新彩票论坛-| www.672228.com-体彩刮刮乐贴吧| www.827856.com-彩票app犯法吗| 中国彩票网www.zg80.com| www.602535.com-558彩-| www.701911.com-淘宝彩票停售公告| www.779902.com-2019彩票店提成| www.847771.com-彩票挂软件-| www.944138.com-头条彩票骗局| www.cz38.com-快三跨服表-| www.485583.com-炫彩之剑掉落| www.803695.com-518彩票官方网站| www.993740.com-足球竞彩怎么玩| www.44ie.com-彩98app网站| www.3783.top-808福彩可信吗| www.003571.com-彩之源app靠谱吗| www.089780.com-彩票500网开奖| www.068789.com-信博彩票登录| www.058335.com-粤彩联盟报纸| www.171001.com-长春快三开奖直播| www.277401.com-双色球牛彩网| www.12343.com-手机自助购彩| www.tm38.com-黄河3d福彩独胆| www.42al.com-万达大玩家刷彩票| www.132607.com-彩票结果公告| www.217220.com-玩大发快三输了报警| www.264144.com-01彩票骗局-| www.770068.com-七彩云浏览器| www.952954.com-竞彩足球胜平负联盟| www.573936.com-四川电信彩铃| www.862411.com-中国手机彩票网下载| www.951167.com-中国竞彩网今日寻胆| 彩票坊www.022l.cc| www.693688.com-玩彩票wcpcc| www.791014.com-体彩大乐透中奖助手| www.875911.com-梦见买彩票中奖了| www.939610.com-重庆福彩大厦| www.979520.com-分分快三预测豹子| www.cp2771.com-那个快三遗漏号| www.621666.cc-广西快三奖池| www.384808.com-亚博彩票创建时间| www.562936.com-玩重庆时时彩被骗| www.418815.com-易旺彩票可靠吗| www.516597.com-色彩的纯度绘画| www.93xv.com-希腊3分彩-| www.064182.com-私彩漏洞骗局| www.539061.com-谁知道快彩网站| www.662365.cc-易彩网平台怎么样| www.792709.com-周边哪里有福彩店| www.964228.com-南方福彩app下载| www.un54.com-福彩五行走势图| www.01377.com-足彩必发盈亏指数| www.545582.com-福彩三地杀码预测| www.240442.com-彩铅基本功-| www.67iz.com-太原福彩转让| www.991628.com-福彩核对-| www.907037.com-彩票投注平台可靠吗| 幸运彩票www.672866.com| www.7616.net-彩票标志-| www.2151.space-足彩十四场购买大厅| 13e彩票www.150196.com| www.880299.com-河南体彩发行中心| www.ji05.com-天天彩选四开奖公告| www.69vs.com-福彩易彩-| www.120032.com-燕赵福彩网快三| www.263207.com-河北快三一定牛开奖| www.356204.com-买彩票app分分彩| www.87429.com-穷人买彩票-| www.905295.com-福彩跨度走势| www.973843.com-最具权威的彩票网站| 幸运彩票www.667537.com| www.ib75.com-内蒙福彩快三一定牛| www.758479.com-举报彩票网站有奖| www.899835.com-c彩83下载-| www.cp697.com-达人彩票官方网站| www.34sc.com-青海七星彩大奖|