使用materialize css水平滑动div

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/materialize/1.0.0/css/materialize.min.css">
<script src="https://cdnjs.cloudflare.com/ajax/libs/materialize/1.0.0/js/materialize.min.js"></script>

<div class="slider">
  <ul class="slides">
    <li>
      <img src="image1.jpg">
    </li>
    <li>
      <img src="image2.jpg">
    </li>
    <li>
      <img src="image3.jpg">
    </li>
  </ul>
</div>

document.addEventListener('DOMContentLoaded', function() {
  var elems = document.querySelectorAll('.slider');
  var instances = M.Slider.init(elems);
});

document.addEventListener('DOMContentLoaded', function() {
  var elems = document.querySelectorAll('.slider');
  var options = {
    duration: 500, // 滑动的速度（毫秒）
    indicators: false, // 是否显示指示器
    interval: 2000, // 自动播放的间隔时间（毫秒）
    fullWidth: true, // 是否使用全宽度
    // 更多选项和方法可以参考官方文档
  };
  var instances = M.Slider.init(elems, options);
});