layui的轮播图实现屏幕滑动

最新推荐文章于 2022-08-25 19:47:24 发布

小New

最新推荐文章于 2022-08-25 19:47:24 发布

阅读量1k

点赞数 3

文章标签： layui javascript html5

本文链接：https://blog.csdn.net/lsk_xs/article/details/120103206

版权

本文介绍如何利用layui框架创建屏幕滑动的轮播图，详细讲解了相关步骤，并鼓励读者在遇到问题时通过评论寻求解答。

摘要由CSDN通过智能技术生成

使用`layui的轮播图实现`

<div class="layui-carousel" id="test1" lay-filter="test1">
    <div carousel-item>
        <div style="background:red;">条目1</div>
        <div style="background:orange;">条目2</div>
        <div style="background:yellow;">条目3</div>
        <div style="background:green;">条目4</div>
        <div style="background:pink;">条目5</div>
    </div>
</div>

<script>
    var i = 0; //记录当前位置
    layui.use('carousel', function () {
   
        var carousel = layui.carousel;
        //建造实例
        ins = carousel