淘宝图片轮播代码 渐变和上下效果代码
| 时间:2011-11-18 11:53 | 来源:未知 | 作者:地瓜 | 浏览: 7766 |
淘宝学堂经常收到淘宝掌柜朋友们的问题，发现很多人都喜欢淘宝图片轮播，我们在逛论坛的时候也发现好多网店都运用到了这一点，在这里我们和大家分享一个通用的淘宝图片轮播代码——渐变和上下效果代码，只要是淘宝旺铺均可使用，该代码可单独使用，也可以嵌套在自己的模板中，代码可以左侧自定义、右侧自定义、中间自定义模块。
第一：淘宝轮播代码渐变效果
<DIV style="WIDTH: 200px; HEIGHT: 60px" 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">
<ul class=lst-main>
<li><A style="WIDTH: 200px; HEIGHT: 60px" href="商品链接地址" target=_blank><img alt="" src="图片地址"></A></li><li><A style="WIDTH: 200px; HEIGHT: 60px" href="商品链接地址" target=_blank><img alt="" src="图片地址"></A></li></ul></DIV>
格式：
<DIV style="WIDTH: 宽度px; HEIGHT: 高度px" 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">
<ul class=lst-main>
<li><A style="WIDTH: 图片宽度px; HEIGHT: 图片高度px" href="商品连接地址" target=_blank><img alt="" src="图片地址"></A></li>
<li><A style="WIDTH: 图片宽度px; HEIGHT: 图片高度px" href="商品连接地址" target=_blank><img alt="" src="图片地址"></A></li>
</ul></DIV>
第二：淘宝图片轮播展示上下变换效果代码
<DIV style="WIDTH: 200px; HEIGHT: 60px" class="slider-promo J_Slider J_TWidget" data-widget-config="{'effect':'scrolly','contentCls': 'lst-main', 'navCls': 'lst-trigger', 'activeTriggerCls': 'current'}" data-widget-type="Slide" data-type="scroll">
<ul class=lst-main>
<li><A style="WIDTH: 200px; HEIGHT: 60px" href="商品链接地址" target=_blank><img alt="" src="图片地址"></A></li><li><A style="WIDTH: 200px; HEIGHT: 60px" href="商品链接地址" target=_blank><img alt="" src="图片地址"></A></li></ul></DIV>
格式：
<DIV style="WIDTH: 宽度px; HEIGHT: 高度px" class="slider-promo J_Slider J_TWidget" data-widget-config="{'effect':'scrolly','contentCls': 'lst-main', 'navCls': 'lst-trigger', 'activeTriggerCls': 'current'}" data-widget-type="Slide" data-type="scroll">
<ul class=lst-main>
<li><A style="WIDTH: 图片宽度px; HEIGHT: 图片高度px" href="商品连接地址" target=_blank><img alt="" src="图片地址"></A></li>
<li><A style="WIDTH: 图片宽度px; HEIGHT: 图片高度px" href="商品连接地址" target=_blank><img alt="" src="图片地址"></A></li>
</ul></DIV>
| 觉得本文有用？ |
