首页 网店学院 网店资讯 网店问答 专栏 店铺装修 拼多多入驻 虾皮入驻 推广返佣
    TOP
    甩手网 > 网店学院 > 网店装修 > 装修代码

    图片轮播:双图垂直滚动代码装修

    2015-04-21 13:42:23 人气:4639

    在淘宝各式各样的营销方法中,视觉营销可以说是最重要的一个营销方法,因此淘宝店铺装修自然而然就成了视觉营销必备的前提条件。

    平常我们看到那些装修的很高端大气上档次的店铺,他们又是如何做视觉营销、如何装修出来的呢?其实代码装修在他们装修是起到了很重要的因素,只有代码才能将店铺装修实现多样化,从而提升视觉效果。

    如果我们可以利用更多的代码装修店铺,那淘宝的装修还会差吗?

    如下图中,此款为双图垂直滚动模版代码,其实也就是两边共4张图片轮播就是了,两边不规则垂直的滚动自动播放,停留时间约3秒、滚动的时间为0.5秒。

    图片轮播:双图垂直滚动代码装修

    关于尺寸:宽度限制为淘宝470,天猫490。高度可以任意设置、我这里是设置了360。

    装修代码:

    <div style="width:950px;height:360px;position:relative;margin-top:0px;float:left;" data-title="本代码由甩手网提供">
             <div class="skin-box-bd clear-fix" style="width:470px;height:360px;position:relative;float:left;">
                    <div class="slider-promo J_TWidget" data-widget-config="{'effect': 'scrolly','triggerType':'mouse','interval':3,'duration':0.5,'autoplay':true,'navCls': 'lst-trigger','contentCls': 'lst-main','activeTriggerCls': 'current'}" data-widget-type="Slide" style="width:950px;height:auto;position:relative;" data-title="本代码由甩手网提供">
                            <div class="lst-main" style="margin-left:0px;top:-360px;">                               
                                    <div class="laimon_slb" style="display:block;">
                                            <span><a title="" href="连接1" target="_blank">
                                            <img src="图片1" style="width:470px;height:360px;"></a></span></div>
                                    <div class="laimon_slb" style="display:block;">
                                            <span><a title="" href="连接2" target="_blank">
                                            <img src="图片2" style="width:470px;height:360px;"></a></span></div>                               
                            </div>
                    </div>
            </div>

            <div class="skin-box-bd clear-fix" style="width:470px;height:360px;position:relative;margin-left:10px;float:left;">
                    <div class="slider-promo J_TWidget" data-widget-config="{'effect': 'scrolly','triggerType':'mouse','interval':3,'duration':0.5,'autoplay':true,'navCls': 'lst-trigger','contentCls': 'lst-main1','activeTriggerCls': 'current'}" data-widget-type="Slide" style="width:950px;height:auto;position:relative;" data-title="本代码由甩手网提供">
                            <div class="lst-main1" style="top:-360px;">                               
                                    <div class="laimon_slb" style="display:block;">
                                            <span><a title="" href="连接3" target="_blank">
                                            <img src="图片3" style="width:470px;height:360px;"></a></span></div>
                                    <div class="laimon_slb" style="display:block;">
                                            <span><a title="" href="连接4" target="_blank">
                                            <img src="图片4" style="width:470px;height:360px;"></a></span></div>
                            </div>
                    </div>
            </div>
     </div>


    天猫:

    <div style="width:990px;height:360px;position:relative;margin-top:0px;float:left;" data-title="本代码由甩手网提供">
             <div class="skin-box-bd clear-fix" style="width:490px;height:360px;position:relative;float:left;">
                    <div class="slider-promo J_TWidget" data-widget-config="{'effect': 'scrolly','triggerType':'mouse','interval':3,'duration':0.5,'autoplay':true,'navCls': 'lst-trigger','contentCls': 'lst-main','activeTriggerCls': 'current'}" data-widget-type="Slide" style="width:990px;height:auto;position:relative;" data-title="本代码由甩手网提供">
                            <div class="lst-main" style="margin-left:0px;top:-360px;">                               
                                    <div class="laimon_slb" style="display:block;">
                                            <span><a title="" href="连接1" target="_blank">
                                            <img src="图片1" style="width:490px;height:360px;"></a></span></div>
                                    <div class="laimon_slb" style="display:block;">
                                            <span><a title="" href="连接2" target="_blank">
                                            <img src="图片2" style="width:490px;height:360px;"></a></span></div>                               
                            </div>
                    </div>
            </div>

            <div class="skin-box-bd clear-fix" style="width:490px;height:360px;position:relative;margin-left:10px;float:left;">
                    <div class="slider-promo J_TWidget" data-widget-config="{'effect': 'scrolly','triggerType':'mouse','interval':3,'duration':0.5,'autoplay':true,'navCls': 'lst-trigger','contentCls': 'lst-main1','activeTriggerCls': 'current'}" data-widget-type="Slide" style="width:990px;height:auto;position:relative;" data-title="本代码由甩手网提供">
                            <div class="lst-main1" style="top:-360px;">                               
                                    <div class="laimon_slb" style="display:block;">
                                            <span><a title="" href="连接3" target="_blank">
                                            <img src="图片3" style="width:490px;height:360px;"></a></span></div>
                                    <div class="laimon_slb" style="display:block;">
                                            <span><a title="" href="连接4" target="_blank">
                                            <img src="图片4" style="width:490px;height:360px;"></a></span></div>
                            </div>
                    </div>
            </div>
     </div> 

    *本站部分文字及图片均来自于网络,如侵犯到您的权益,请及时通知我们删除。联系信息:甩手网
    关注微信
    淘宝店铺装修

    淘宝店铺装修

    网店装修对于卖家来说就是通往销量的门,核心在于促进交易的进行。 良好的店铺装修能够给买家很直观的视觉体验和心理作用,进一步获得更优质的客户源和转化率,是我们经营店铺的一大利器。本专题让你能够学到从新手到...

    详情>>
    淘宝实用工具
    关于甩手软件     |     关于我们     |     联系我们     |     服务条款     |     隐私协议     |     用户权限     |     站点地图     |     帮助中心

    甩手客户服务

    • 甩手问答
    • 在线客服:企业QQ 800055007
    • 白班咨询电话(9:00-18:00):
      0755-26470437/26470392
      晚班咨询电话(18:00-22:00):
      18926581976/18926585976
    • 客服上班时间:
      周一至周五9:00--22:00,周末9:00--17:00
      (除法定节日以外,其他不在线时间请留言,
      我们看到后会第一时间回复您!)
    • 甩手网投诉电话:0755-26470437/26470392转621

    关注公众号

    Copyright ©2010-2020 深圳市华通易点信息技术有限公司 - 甩手网 All Rights Reserved.[粤ICP备12028137号]

    粤公网安备 44030502000916号

    关闭
    在线客服
    投诉建议