网站首页 > 文章精选正文

用网页做个ppt- 定时全屏切换图片

balukai 2025-01-04 17:01:58 文章精选 9 ℃

用网页做个ppt，就是目录下一堆图片，每隔10秒切换一个图片，全屏显示。

图片如果分辨率不同，也可以自动拉伸。

用ai折腾了一下。

<!DOCTYPE html>
<html>

<head>
  <style>
    body {
      margin: 0;
      overflow: hidden;
    }


    
    #image {
  width: 100vw;
  height: 100vh;
  object-fit: fill;
  display: flex;
  justify-content: center;
  align-items: center;
}
  </style>
  <script>
    var images = ["image1.jpg", "image2.jpg", "image3.jpg"];
    var currentImage = 0;

    function changeImage() {
      var imageElement = document.getElementById("image");
      imageElement.src = images[currentImage];
      currentImage = (currentImage + 1) % images.length;
    }

    setInterval(changeImage, 60000);
  </script>
</head>

<body>
  <img id="image" src="image1.jpg" alt="Image" />
</body>

</html>

上一篇： HTML翻牌器:用CSS和HTML元素创造动态数字展示
下一篇： web前端:CSS的常用属性速查表

网站首页 > 文章精选 正文

用网页做个ppt- 定时全屏切换图片

猜你喜欢

网站首页 > 文章精选正文