跳转到 img 库中的页面顶部

Question

我以前问过这个问题，我收到的答案对我不起作用。

我有一个HTML网站，有大约50张图片可供选择。单击其中一个时，将打开一个模态站点，其中包含一个幻灯片（顶部是大样本，下面是小样本）。我希望在JS代码中添加，在选择其中一个小样本后，窗口会自动跳转到页面顶部，其中样本以更大的尺寸显示。

这是我的JS代码：

<script>
    function openModal() {
        document.getElementById('myModal').style.display = "block";
    }
    function closeModal() {
        document.getElementById('myModal').style.display = "none";
    }
    var slideIndex = 1;
    showSlides(slideIndex);
    function plusSlides(n) {
    showSlides(slideIndex += n);
    }
    function currentSlide(n) {
    showSlides(slideIndex = n);
    }
    function showSlides(n) {
        var i;
        var slides = document.getElementsByClassName("mySlides");
        var dots = document.getElementsByClassName("demo");
        var captionText = document.getElementById("caption");
        if (n > slides.length) {slideIndex = 1}
        if (n < 1) {slideIndex = slides.length}
        for (i = 0; i < slides.length; i++) {
        slides[i].style.display = "none";
        }
        for (i = 0; i < dots.length; i++) {
            dots[i].className = dots[i].className.replace(" active", "");
        }
        slides[slideIndex-1].style.display = "block";
        dots[slideIndex-1].className += " active";
        captionText.innerHTML = dots[slideIndex-1].alt;
    }
</script>

我已经尝试将window.scrollTo(0, 0);添加到currentSlide(n)函数中，只是滚动（0,0），但它不起作用。

这就是onclick="currentSlide"所在的地方。我从网上的某个地方得到了这个代码。

<div class="column"><img class="demo" src="img/gallery/img55.jpg" onclick="currentSlide(55)" alt="Sample 55"></div>
       </div>   <!-- end div modal_samples -->
    </div> <!-- end div modal content -->

如果您需要我提供其他内容，请告诉我。

Answer 1

我不确定您对该功能有多远，但您可以使用类似以下内容："window.location.hash = null;window.location.hash='（大图像的 id 属性值）';" 在现有函数或新函数中。

所以，基本上：

从以前的任何设置重置

window.location.hash = null;

为包含大图像的 IMG 元素设置新的 SRC（在页面顶部）largeImageElement.src = （URL to Image OR 与缩略图 SRC 相同）;

移动到大图像 （IMG） 在页面上所在的位置

window.location.hash = largeImageElement.id;

如果您不明白，请告诉我。