Web 滚动至顶部代码

Web 滚动至顶部代码,web,scroll,photo,Web,Scroll,Photo,我希望当用户点击图库上的缩略图时,页面应该自动滚动到顶部。代码如下: <div id="gallery" class="content"> <div class="wrapper"> <div class="slideshow-c``ontainer"> <div id="slideshow" class="sl

我希望当用户点击图库上的缩略图时,页面应该自动滚动到顶部。代码如下:

  <div id="gallery" class="content">
                   <div class="wrapper">
                       <div class="slideshow-c``ontainer">
                            <div id="slideshow" class="slideshow"></div>
                        </div>
                    </div>
                </div>
                <div id="thumbs" class="navigation">
                    <h3>Gallery</h3>
                    <ul class="thumbs noscript">
                        <li>
                            <a class="thumb" href="images/slider-img1.jpg" title=""> <img src="images/page1-img1.jpg" alt="" /><span></span> </a>
                        </li> 
                        <li>
                            <a class="thumb" href="images/slider-img2.jpg" title=""> <img src="images/page2-img1.jpg" alt="" /> <span></span></a>
                        </li> 
                        <li>
                            <a class="thumb" href="images/slider-img3.jpg" title=""> <img src="images/page2-img2.jpg" alt="" /> <span></span></a>
                        </li> 
                        <li class="last">
                            <a class="thumb" href="images/slider-img4.jpg" title=""> <img src="images/page3-img1.jpg" alt="" /> <span></span></a>
                        </li>
                        <li>
                            <a class="thumb" href="images/slider-img5.jpg" title=""> <img src="images/page1-img2.jpg" alt="" /> <span></span></a>
                        </li> 
                        <li>
                            <a class="thumb" href="images/slider-img6.jpg" title=""> <img src="images/page1-img3.jpg" alt="" /> <span></span></a>
                        </li>
                        <li>
                            <a class="thumb" href="images/slider-img7.jpg" title=""> <img src="images/page1-img4.jpg" alt="" /><span></span> </a>
                        </li> 
                        <li class="last">
                            <a class="thumb" href="images/slider-img8.jpg" title=""> <img src="images/page1-img5.jpg" alt="" /> <span></span></a>
                        </li>  
                        <li>
                            <a class="thumb" href="images/slider-img9.jpg" title=""> <img src="images/page1-img6.jpg" alt="" /><span></span> </a>
                        </li> 
                        <li>
                            <a class="thumb" href="images/slider-img10.jpg" title=""> <img src="images/page1-img7.jpg" alt="" /> <span></span></a>
                        </li> 
                        <li>
                            <a class="thumb" href="images/slider-img11.jpg" title=""> <img src="images/page1-img8.jpg" alt="" /> <span></span></a>
                        </li> 
                        <li class="last">
                            <a class="thumb" href="images/slider-img12.jpg" title=""> <img src="images/page1-img9.jpg" alt="" /> <span></span></a>
                        </li>  
                        <li class="last2">
                            <a class="thumb" href="images/slider-img13.jpg" title=""> <img src="images/page1-img10.jpg" alt="" /> <span></span></a>
                        </li> 
                        <li class="last2">
                            <a class="thumb" href="images/slider-img14.jpg" title=""> <img src="images/page1-img11.jpg" alt="" /> <span></span></a>
                        </li>
                        <li class="last2">
                            <a class="thumb" href="images/slider-img15.jpg" title=""> <img src="images/page1-img12.jpg" alt="" /><span></span> </a>
                        </li> 
                        <li class="last last2">
                            <a class="thumb" href="images/slider-img16.jpg" title=""> <img src="images/page1-img13.jpg" alt="" /> <span></span></a>
                        </li>

                    </ul>
                </div>
            </div>
        </div>
        <div class="block"></div>

将标签中的href设置为图像本身。这不就是在自己的页面上加载图像吗

您可以使用ID以页面的特定区域为目标进行滚动

<a href="#someid">Scroll</a>

More page content

<div id="someid">
    Content to scroll too
</div>

是的,它在自己的页面上加载,所以当点击图像时,它应该加载,同时页面应该滚动到顶部,这是可能的吗?我不确定我是否理解。如果图像正在加载到它自己的窗口中,它是否应该滚动到新页面的顶部?这是网站和图库,也许你会明白,你上面提供的代码与你的链接不匹配。我假设站点上的HREF使用编号的ID来切换映像本身?我将使用一些JavaScript来处理切换图像和滚动返回顶部这两个函数。这就是说,我认为如果用户必须不断向下滚动以切换图像,这将是非常令人沮丧的。我将研究另一个更方便用户的幻灯片库选项。