淘宝装修免费模板发现很多人都喜欢淘宝图片轮播,我们在逛论坛的时候也发现好多网店都运用到了这一点,在这里淘宝学堂和大家分享一个通用的淘宝图片轮播代码,只要是淘宝旺铺均可使用,该代码可单独使用,也可以嵌套在自己的模板中,代码可以左侧自定义、右侧自定义、中间自定义模块。
第一:淘宝轮播代码渐变效果
<div class="slider-promo J_Slider J_TWidget" data-widget-config="{\&;effect\&;:\&;fade\&;,\&;contentCls\&;: \&;lst-main\&;, \&;navCls\&;: \&;lst-trigger\&;, \&;activeTriggerCls\&;: \&;current\&;}" data-widget-type="Slide" data-type="fade"> <p> </p> <p> </p> <ul class="lst-main"> <p> </p> <p> </p> <li><a target="_blank" href="商品连接地址"><img alt="" src="图片地址" /></a> <p> </p> <p> </p> </li> <li><a target="_blank" href="商品连接地址"><img alt="" src="图片地址" /></a> <p> </p> <p> </p> </li> </ul> </div>
第二:淘宝图片轮播展示上下变换效果代码
<Table width=750>
<DIV class="box J_TBox"><DIV class=shop-slider><DIV class=bd><DIV class="slider-promo J_Slider J_TWidget" style="HEIGHT: 450px" data-type="scrolly" data-widget-type="Slide" data-widget-config="{\&;effect\&;:\&;scrolly\&;,\&;contentCls\&;: \&;lst-main\&;, \&;navCls\&;: \&;lst-trigger\&;, \&;activeTriggerCls\&;: \&;current\&;}"><ul class=lst-main></DIV></Table>
注意:此模式图片宽度不能小于750像素,否则留白很大。代码中蓝色部分为图片地址,可以替换自己制作的存放在图片空间中的轮播图。红色部分为图片所示宝贝的详情页面。
备注:此代码在IE浏览器上不能复制时,可选择其他浏览器,比如谷歌浏览器。