新用户申请
请填写您的联系方式,我们会主动与您联系
*号标识为必填信息
当前位置: 乐外卖 > 外卖系统资讯 > 外卖小程序轮播图,小程序怎样实现无缝轮播

外卖小程序轮播图,小程序怎样实现无缝轮播

发布:2021-06-15 作者:乐外卖 阅读:57

外卖小程序轮播图,小程序怎样实现无缝轮播

小程序轮播图和菜单同一页面冲突怎么办

光是html的话很难实现轮播,轮播一般都是html+js才能完成。
给你一个最简单的html+js轮播例子:
html代码:
<div class="side" id = "lunbo">
<ul">
<li><img src="../images/1.jpg"></li>
<li><img src="../images/2.jpg"></li>
<li><img src="../images/3.jpg"></li>
</ul>
</div>
js代码:
var li=document.getElementById('lunbo').getElementsByTagName("li");
var num=0;
var len=li.length;

setInterval(function(){
li[num].style.display="none";
num=++num==len?0:num;
li[num].style.display="inline-block";

},3000);//切换时间

免责声明:部分文章信息来源于网络以及网友投稿,本网站只负责对文章进行整理、排版、编辑,是出于传递 更多信息之 目的,并不意味着赞同其观点或证实其内容的真实性,如本站文章和转稿涉及版权等问题,请作者在及时联系本站,我们 会尽快处理。官方所有内容、图片如未经过授权,禁止任何形式的采集、镜像,否则后果自负!

标题:外卖小程序轮播图,小程序怎样实现无缝轮播

地址:http://www.lewaimai.com/article/14632.html