基础版全屏轮播代码1920X590淘宝店铺装修基础版底部箭头全屏轮播模板,保证可以用喔!
以下是效果图:
代码使用方法:复制以下代码,然后把代码放进750自定义里面就好了,然后替换成自己图片空间地址,和宝贝连接,怎么替换我就不多说了,自己找一下 img href.
<div class="J_TWidget mypopermqgvkFqb" data-widget-config="{'effect': 'fade','circular': true ,'contentCls':'sj-tmqgvkFqb','navCls':'sj-nmqgvkFqb','autoplay':'true'}" data-widget-type="Tabs" style="padding-bottom: 0px; margin: 0px; padding-left: 0px; padding-right: 0px; height: 590px; overflow: hidden; padding-top: 0px"><div class="sj-tmqgvkFqb"><div class="J_TWidget" data-widget-config="{'contentCls': 'sj-contentmqgvkFqb','navCls': 'sj-nmqgvkFqb','triggerType': 'click','effect': 'fade','steps': 1,'autoplay': true,'circular': true ,'prevBtnCls':'prev1mqgvkFqb','nextBtnCls':'next1mqgvkFqbmqgvkFqb'}" data-widget-type="Carousel"><div class="pa2" style="width:1920px;height:590px;overflow:hidden;position:relative;left:-685px;top:0px;"><ul class="sj-contentmqgvkFqb" style="padding-bottom: 0px; margin: 0px; padding-left: 0px; width: 1920px; padding-right: 0px; height: 590px; overflow: hidden; padding-top: 0px"><li style="padding-bottom: 0px; list-style-type: none; margin: 0px; padding-left: 0px; width: 1920px; padding-right: 0px; height:590x; padding-top: 0px;"><div class="skin-box tb-module"> <s class="skin-box-tp"><b></b></s> <div class="skin-box-bd clear-fix"> <span> <div style="height:590px;"> <div class="footer-more-trigger" style="width:1920px;height:590px;border:0;padding:0;right:auto;z-index:1;top:auto;left:50%;"> <div class="footer-more-trigger" style="width:1920px;height:590px;border:0;right:auto;z-index:1;padding:0;top:-10px;left:-50%;"> <div style="margin:0px;padding:0px;width:1920px;height:600px;"> <div class="footer-more-trigger -_-switchable-panel-internal481" style="margin:0px;padding:0px;border:0;width:1920px;height:600px;overflow:hidden;z-index:3;left:auto;top:auto;"> <div class="J_TWidget" data-widget-type="Carousel" data-widget-config="{'nextBtnCls':'mall-next','easing':'easeOutStrong','activeTriggerCls':'hidden','effect':'scrollx','navCls':'nav_yuzhou','prevBtnCls':'mall-prev','contentCls':'content_yuzhou','autoplay':true}" style="height:600px;overflow:hidden;"> <ul class="content_yuzhou"> <li style="width:1920px;height:600px;overflow:hidden;"> <a href="http://feimayi.taobao.com" target="_blank"> <img src="https://img.alicdn.com/imgextra/i2/1604414189/TB25CMOiVXXXXbwXXXXXXXXXXXX_!!1604414189.jpg" width="1920" height="600" alt=""/></a> <table width="1920" height="600" border="0" cellpadding="0" cellspacing="0"> <tbody> </tbody> </table> </li> <li style="width:1920px;height:600px;"> <a href="http://feimayi.taobao.com" target="_blank"><img src="https://img.alicdn.com/imgextra/i1/1604414189/TB2o9kHiVXXXXc_XXXXXXXXXXXX_!!1604414189.jpg" width="1920" height="600" alt=""/></a> <table width="1920" height="600" border="0" cellpadding="0" cellspacing="0"> <tbody> </tbody> </table> </li> <li style="width:1920px;height:600px;"> <a href="http://feimayi.taobao.com" target="_blank"><img src="https://img.alicdn.com/imgextra/i1/1604414189/TB2Rfs0iVXXXXX0XXXXXXXXXXXX_!!1604414189.jpg" width="1920" height="600" alt=""/></a> <table width="1920" height="600" border="0" cellpadding="0" cellspacing="0"> <tbody> </tbody> </table> </li> <li style="width:1920px;height:600px;"> <a href="http://feimayi.taobao.com" target="_blank"><img src="https://img.alicdn.com/imgextra/i3/1604414189/TB2RSkZiVXXXXXZXXXXXXXXXXXX_!!1604414189.jpg" width="1920" height="600" alt=""/></a> <table width="1920" height="600" border="0" cellpadding="0" cellspacing="0"> <tbody> </tbody> </table> </li> <li style="width:1920px;height:600px;"> <a href="http://feimayi.taobao.com" target="_blank"><img src="http://img01.taobaocdn.com/imgextra/i1/796978238/TB2pzSubXXXXXXtXpXXXXXXXXXX-796978238.jpg" width="1920" height="600" alt=""/></a> <table width="1920" height="600" border="0" cellpadding="0" cellspacing="0"> <tbody> </tbody> </table> </li> </ul> <ul class="footer-more-trigger" style="width:150px;height:30px;z-index:98;padding:0;border:0;right:auto;top:auto;left:880px;bottom:15px;cursor:pointer;"> <li style="width:30px;height:30px;background:url(http://img01.taobaocdn.com/imgextra/i1/796978238/TB245i7aXXXXXXpXXXXXXXXXXXX-796978238.jpg) 0 -30px;display:block;float:left;"> </li> <li style="width:30px;height:30px;display:block;background:url(http://img01.taobaocdn.com/imgextra/i1/796978238/TB245i7aXXXXXXpXXXXXXXXXXXX-796978238.jpg) 0 -30px;float:left;"> </li> <li style="width:30px;height:30px;display:block;background:url(http://img01.taobaocdn.com/imgextra/i1/796978238/TB245i7aXXXXXXpXXXXXXXXXXXX-796978238.jpg) 0 -30px;float:left;"> </li> <li style="width:30px;height:30px;display:block;background:url(http://img01.taobaocdn.com/imgextra/i1/796978238/TB245i7aXXXXXXpXXXXXXXXXXXX-796978238.jpg) 0 -30px;float:left;"> </li> <li style="width:30px;height:30px;display:block;background:url(http://img01.taobaocdn.com/imgextra/i1/796978238/TB245i7aXXXXXXpXXXXXXXXXXXX-796978238.jpg) 0 -30px;float:left;"> </li> </ul> <ul class="nav_yuzhou footer-more-trigger" style="width:150px;height:30px;right:auto;z-index:99;padding:0;border:0;top:auto;left:880px;bottom:15px;cursor:pointer;"> <li class="hidden" style="width:30px;background:url(http://img01.taobaocdn.com/imgextra/i1/796978238/TB245i7aXXXXXXpXXXXXXXXXXXX-796978238.jpg) 0 0;height:30px;display:block;float:left;"> </li> <li style="width:30px;height:30px;display:block;background:url(http://img01.taobaocdn.com/imgextra/i1/796978238/TB245i7aXXXXXXpXXXXXXXXXXXX-796978238.jpg) 0 0;float:left;"> </li> <li style="width:30px;height:30px;display:block;background:url(http://img01.taobaocdn.com/imgextra/i1/796978238/TB245i7aXXXXXXpXXXXXXXXXXXX-796978238.jpg) 0 0;float:left;"> </li> <li style="width:30px;height:30px;display:block;background:url(http://img01.taobaocdn.com/imgextra/i1/796978238/TB245i7aXXXXXXpXXXXXXXXXXXX-796978238.jpg) 0 0;float:left;"> </li> <li style="width:30px;height:30px;display:block;background:url(http://img01.taobaocdn.com/imgextra/i1/796978238/TB245i7aXXXXXXpXXXXXXXXXXXX-796978238.jpg) 0 0;float:left;"> </li> </ul> <div class="mall-prev footer-more-trigger" style="width:30px;height:30px;padding:0px;margin:0px;border:none;top:0px;right:auto;float:right;z-index:99;left:1030px;top:605px;text-align:center;"> <img src="http://img01.taobaocdn.com/imgextra/i1/796978238/TB2jc9YaXXXXXa3XpXXXXXXXXXX-796978238.jpg" style="width:30px;height:30px;cursor:pointer;"/> </div> <div class="mall-next footer-more-trigger" style="width:30px;height:30px;padding:0px;margin:0px;border:none;top:0px;left:auto;float:left;z-index:99;left:850px;top:605px;text-align:center;"> <img src="http://img03.taobaocdn.com/imgextra/i3/796978238/TB28CiZaXXXXXX4XpXXXXXXXXXX-796978238.jpg" style="display:block;width:30px;height:30px;cursor:pointer;"/> </div> </div> </div> </div> </div> </div> </div> </span> </div> </div></li></ul></div><div style="width: 1920px; display: none; height: 0px; overflow: hidden"><ul class="sj-tmqgvkFqb" style="padding-bottom: 0px; margin: 0px; padding-left: 0px; width: 1920px; padding-right: 0px; height: 50px; padding-top: 0px"><li style="padding-bottom: 0px; list-style-type: none; margin: 0px; padding-left: 0px; width: 315px; padding-right: 0px; background: black; float: left; height: 590px; padding-top: 0px"></li><li style="padding-bottom: 0px; list-style-type: none; margin: 0px; padding-left: 0px; width: 315px; padding-right: 0px; background: #f8c; float: left; height: 590px; padding-top: 0px"></li><li style="padding-bottom: 0px; list-style-type: none; margin: 0px; padding-left: 0px; width: 315px; padding-right: 0px; background: #f1c; float: left; height: 590px; padding-top: 0px"></li></ul></div><ul class="sj-nmqgvkFqb" style="display: none;"><li>1</li></ul></div></div></div>