淘寶圖片輪播代碼 漸變和上下效果代碼

2011-11-17|HiShop
導(dǎo)讀很多人都喜歡淘寶圖片輪播,我們?cè)诠湔搲臅r(shí)候也發(fā)現(xiàn)好多網(wǎng)店都運(yùn)用到了這一點(diǎn),在這里淘寶學(xué)堂和大家分享一個(gè)通用的淘寶圖片輪播代碼,只要是淘寶旺鋪均可使用,該代碼可單獨(dú)使用,也可以嵌套在自己的模板中,代碼可以左側(cè)自定義、右側(cè)自定義、中間自定義...

很多人都喜歡淘寶圖片輪播,我們?cè)诠湔搲臅r(shí)候也發(fā)現(xiàn)好多網(wǎng)店都運(yùn)用到了這一點(diǎn),在這里淘寶學(xué)堂和大家分享一個(gè)通用的淘寶圖片輪播代碼,只要是淘寶旺鋪均可使用,該代碼可單獨(dú)使用,也可以嵌套在自己的模板中,代碼可以左側(cè)自定義、右側(cè)自定義、中間自定義模塊。

第一:淘寶輪播代碼漸變效果

<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> 

【本站聲明】 1、本網(wǎng)站發(fā)布的該篇文章,目的在于分享電商知識(shí)及傳遞、交流相關(guān)電商信息,以便您學(xué)習(xí)或了解電商知識(shí),請(qǐng)您不要用于其他用途; 2、該篇文章中所涉及的商標(biāo)、標(biāo)識(shí)的商品/服務(wù)并非來(lái)源于本網(wǎng)站,更非本網(wǎng)站提供,與本網(wǎng)站無(wú)關(guān),系他人的商品或服務(wù),本網(wǎng)站對(duì)于該類(lèi)商標(biāo)、標(biāo)識(shí)不擁有任何權(quán)利; 3、本網(wǎng)站不對(duì)該篇文章中所涉及的商標(biāo)、標(biāo)識(shí)的商品/服務(wù)作任何明示或暗示的保證或擔(dān)保; 4、本網(wǎng)站不對(duì)文章中所涉及的內(nèi)容真實(shí)性、準(zhǔn)確性、可靠性負(fù)責(zé),僅系客觀性描述,如您需要了解該類(lèi)商品/服務(wù)詳細(xì)的資訊,請(qǐng)您直接與該類(lèi)商品/服務(wù)的提供者聯(lián)系。

相關(guān)推薦閱讀

1 首屆中國(guó)電商與媒介營(yíng)銷(xiāo)論壇將于四月在北京舉行

3月8日消息,由泛媒體分賬研究院主辦、中國(guó)電子商務(wù)研究中心聯(lián)合主辦的首屆中國(guó)電商與媒介營(yíng)銷(xiāo)高峰論壇將于4月21日在北.....

2 淘寶規(guī)則:天貓國(guó)際公布2017技術(shù)服務(wù)年費(fèi)調(diào)整

據(jù)最新天貓官方消息,在2017年1月3日天貓國(guó)際公布《2017年度各類(lèi)目技術(shù)服務(wù)年費(fèi)調(diào)整通知》。.....

3 手機(jī)無(wú)線直通車(chē)怎么開(kāi)通(操作技巧及策略分析

今天這篇文章,Hishop小編會(huì)和大家一起分析和探討淘寶運(yùn)營(yíng)實(shí)戰(zhàn)經(jīng)驗(yàn)。我們將采用總結(jié)+演示的方式來(lái)給大家呈現(xiàn),幫助大家.....

4 2016年圣誕節(jié)店鋪促銷(xiāo)活動(dòng)方案

相信很多淘寶賣(mài)家還在為這個(gè)圣誕節(jié)活動(dòng)方案搞什么活動(dòng)促銷(xiāo)而煩惱,其實(shí)策劃活動(dòng)無(wú)非就是為了回饋老顧客,吸引新客戶,.....

5 季節(jié)交替期 網(wǎng)店如何做好甩貨促銷(xiāo)策略

一、 網(wǎng)店的開(kāi)設(shè)宣傳 在網(wǎng)店在建設(shè)之前必須要有好的定位,要有自己有特色的產(chǎn)品,看一下和別人相比有沒(méi)有競(jìng)爭(zhēng)優(yōu)勢(shì),要.....

重磅推薦:淘寶學(xué)院目錄

第一部分:極速推

第三部分:微詳情

第四部分:百億補(bǔ)貼

第五部分:淘金幣

第六部分:天天特賣(mài)

第七部分:淘寶直播

第八部分:淘寶特價(jià)版

第九部分:相關(guān)推薦