phpcms 组图分页

// 示例代码：图片懒加载
<img data-src="image.jpg" class="lazyload" />

<script>
document.addEventListener("DOMContentLoaded", function() {
  var lazyImages = [].slice.call(document.querySelectorAll("img.lazyload"));
  if ("IntersectionObserver" in window) {
    let lazyImageObserver = new IntersectionObserver(function(entries, observer) {
      entries.forEach(function(entry) {
        if (entry.isIntersecting) {
          let lazyImage = entry.target;
          lazyImage.src = lazyImage.dataset.src;
          lazyImage.classList.remove("lazyload");
          lazyImageObserver.unobserve(lazyImage);
        }
      });
    });
    lazyImages.forEach(function(lazyImage) {
      lazyImageObserver.observe(lazyImage);
    });
  }
});
</script>

// 示例代码：后端分页逻辑
$page = isset($_GET['page']) ? intval($_GET['page']) : 1;
$limit = 10; // 每页显示的图片数量
$offset = ($page - 1) * $limit;

$sql = "SELECT * FROM images LIMIT $limit OFFSET $offset";
$result = mysqli_query($conn, $sql);

// 生成分页链接
$total_rows = mysqli_num_rows(mysqli_query($conn, "SELECT * FROM images"));
$total_pages = ceil($total_rows / $limit);
for ($i = 1; $i <= $total_pages; $i++) {
  echo "<a href='?page=$i'>$i</a> ";
}