Javascript 为灯箱中的图像创建循环

我想在一个显示83幅图像的网站上实现一个lightbox，我不打算将它们全部复制粘贴到HTML中，所以我希望它们与PHP一起循环

他们已经在另一个页面上工作了，所以我复制了那个代码，但我无法让它工作

我在工作代码中得到了什么：

<a href="images/project1.jpg" rel="lightbox[slides]"><img src="images/project1.jpg" border=0></a><!--class="spacing"-->
<div style="visibility: hidden;">
    <?
        $dirname = 'afbeeldingen/slides/exhaustion_pipe/';
        $images = scandir($dirname);
        $ignore = Array(".", "..");

        foreach($images as $curimg){
            if(!in_array($curimg, $ignore)) {
                echo '<a href="'.$dirname.$curimg.'" rel="lightbox[slides]"><img src="'.$dirname.$curimg.'" width="1" height="1" border="0"></a>';
            }
        }
    ?>
</div>

现在我尝试将其复制并编辑到以下位置：

<a href="afbeeldingen/slides/dias/Dia1.JPG" rel="lightbox[slides]">Bla</a><!--class="spacing"-->
    <div style="visibility: hidden;">
        <?
            $dirname = 'afbeeldingen/slides/dias/';
            $images = scandir($dirname);
            $ignore = Array(".", "..");

            foreach($images as $curimg){
                if(!in_array($curimg, $ignore)) {
                    echo '<a href="'.$dirname.$curimg.'" rel="lightbox[slides]"><img src="'.$dirname.$curimg.'" width="1" height="1" border="0"></a>';
                }
            }
        ?>
    </div>

我去掉了图像，把它变成了文本，因为我还没有正确的图像

当我单击文本时，它会在一个新窗口中显示Dia1.JPG，但我希望在lightbox中打开第一个图像，您可以从中导航到其他图像

如果有帮助，这是lightbox.js：

我希望我提供了足够的资源来理解我的意思

有人知道如何在灯箱中循环83幅图像吗？这些图像被称为Dia1-Dia83

---

谢谢

你的代码片段很好，你能检查一下你的css文件lightbox.css是否正确地包含在你的html页面中吗？是的，lightbox.css包含在top_new.php（标题）中，这就是我添加它的方式：我不知道你的lightbox.css文件夹层次结构href=”“应该根据你放置文件的文件夹。还有一件事我尝试在html的include css file here部分中使用。我已经在head部分中包含了css文件。所以我不知道是什么原因造成的，看起来JS没有加载。