首页 > 解决方案 > 当我有一个锚标记引用同一页面中的另一个部分时,如何使它不立即显示我点击它

问题描述

  <html>
    <body>
      <UL>
                        <li>
                            <a class="boss" >Home</a>
                        </li>
                        <li>
                            <a  id = "#About">About</a>
                        </li>
                    
                        <li>
                            <a id="#Services">Services</a>
                        </li>
                        <li>
                            <a id="#Contact">Contact</a>
                        </li>
     </UL>
    
     <section id="About">
                <div class ="About">
                    <h2>About</h2>
                <image>
                <image>
                <image>
                <image>
 </section>
这是我的代码,当单击上面的任何链接时,它会链接到一个页面,但是它引用该部分的速度太快了,我想减少它

哦解决了只是将滚动行为设置为平滑

标签: javascripthtmlcss

解决方案


您可以在 CSS中使用scroll-behavior并将其设置为:smooth

html {
    scroll-behavior: smooth;
}

当您单击带有元素 ID 标记的按钮时,这将有一个平滑的过渡。


推荐阅读