时间戳

首页 > 解决方案 > 使用 jQuery/javascript 动态添加目录中的所有图像

javascript - 使用 jQuery/javascript 动态添加目录中的所有图像

问题描述

我想创建一个简单的网站，可以滚动浏览给定文件夹中的所有图片。

我有一个简单的 jQuery 脚本，它将在页面上一次显示一个图像，在图片之间淡化。它目前适用于硬编码图像。

理想情况下，我想编写一个脚本，为特定文件夹（比如/images）中的所有图像动态创建标签。我的脚本如下所示，但它不提取任何图像。

谁能看到这里有什么问题？谢谢！

<html><head>
<style>
.gallery { position:relative; height:500px; width:800px; }
.gallery img { position:absolute; height:500px; width:800px; }
</style>

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>

</head>
<body>

<script>
//load images and fade them in and out - this works
$(function(){
    $('.gallery img:gt(0)').hide();
    setInterval(function(){
      $('.gallery :first-child').fadeOut()
         .next('img').fadeIn()
         .end().appendTo('.gallery');}, 
      3000);
});

//create an imageList id with a list of all images in a folder - this does not work
$('<img>')
    .attr('src', '/images')
    .appendTo('#imageList')

</script>


<div class="gallery" id="imageList"></div>

</body>
</html>

标签： javascriptjqueryhtml

解决方案

推荐阅读