淘宝图片轮播代码

下面图片轮播代码中

与

之间的代码为用户可以自定义修改的部分，为轮播的图片地址和超级连接地址信息。

中的“http://mb2.yubaibai.com.cn/201011/30/90221245122.jpg为图片地址。 淘巧好，好淘巧
第四行style="height:400px;" data-widget-config中的400px为图片高度设置
（1）轮播的几个图片一定要大小相同。
（2）适用范围：淘宝扶持版店铺、淘宝标准版旺铺、淘宝旗舰版旺铺、淘宝拓展版旺铺、淘宝商城。 本文来自淘巧

• 
  
  


• 
  
  
  


• 
  
  
  

• 1


• 2


• 3

内容来自taoqao

 
WIDTH：指图片的长 HEIGHT：图片的高 a href="超级链接地址" target="_blank"在心的窗口打开
img border="0" 图片的边框有无/"1"现实边框 "2"隐藏边框 src="图片地址" 换成自己的就OK了

1

2

3

代表图片的数量,
如果想添加4个就在写一个

4

和

就可以了

• 


• 


• 


• 

• 1
• 2
• 3
• 4

前面的“宝贝链接”就是你宝贝的链接地址,后面的“图片地址”就是你想要显示的图片的地址，在这里需要解释一下，本轮播代码里面图片的默认高度是400像素，所以你做图片的时候必须根据自己的放置位置，相应的设置图片的宽度，比如扶植版自定义区宽度是750像素，所以你做图片的时候就要做成750×400。如果你通栏的那种就得做成900×400。







第一种：渐变式

   

   

   

   

   

   

   
• 
     
• 
     
  

   

    第二种：上下式轮播
   

   

   
• 

   

一、亲要使用代码的哦

    二、左侧栏和右侧栏各添加一个自定义区

    三、将如下代码分别复制到两个自定义区的源码编辑区内：

    1、右侧自定义区代码

      

data-widget-type="Slide" data-widget-config="{'effect':'fade',

'contentCls': 'lst-main', 'navCls': 'lst-trigger', 'activeTriggerCls': 'current'}">

• 
  
• 
  
• 
  
• 

• 1
• 2
• 3
• 4

    

    2、左侧自定义区代码

      

    现在小妹解释下以上代码的意思：

    右侧自定义区：轮播及950通栏实现代码。RIGHT:200px  是指将图片整体左移200px，这样子950宽的图片正好铺满整个通栏。WIDTH:950px; HEIGHT: 450px  大家都懂得，是图片宽950，高450，高度亲们可以按照自己的需要设置哦。“链接地址”是宝贝的地址；“图片地址”可以从图片空间获得。如果亲们想要多设置一个轮播图片，可以复制代码

添加。当然，如果亲只想要轮播效果不要大通栏，只要将WIDTH:950px（即图片宽度）修改为WIDTH:750px，并将RIGHT:200px；删除即可。因为图片左移，实现通栏但是会遮住左边的页面，解决办法就看下面。

    左侧自定义区：

是设置一个空的高度为450的支架，注意左侧高度设置要与右侧的高度设置一样哦！这样就解决了上面的问题了。
    这样做出的通栏效果是无缝的哦，真正和拓展版一样，效果可以进我的店铺瞧一瞧！

    注意：图片地址和链接地址的修改不需要必须在代码编辑状态下进行的哦，可以在正常的编辑状态下双击图片就可以进行的。

    希望此贴对大伙真正有帮助！