Chrome 锚点不能跳转兼容解决方法
时间: 2023-10-13 10:04:20 浏览: 132
如果在 Chrome 浏览器下锚点不能跳转,可以尝试以下兼容解决方法:
使用 JavaScript 实现跳转:在链接中添加 onclick 事件,并使用 JavaScript 实现跳转。例如:
<a href="#section2" onclick="location.href='#section2';return false;">跳转到section2</a>
使用 jQuery 实现跳转:如果您的网站使用了 jQuery 库,可以使用以下代码实现跳转:
$('a[href^="#"]').click(function(e) { e.preventDefault(); var target = $(this).attr("href"); $('html, body').animate({ scrollTop: $(target).offset().top }, 500); });
这段代码会在页面加载完成后,对所有带有 href 属性并以 "#" 开头的链接添加点击事件。点击链接后,会平滑滚动到相应的锚点位置。
使用第三方插件:如果您不想编写 JavaScript 或 jQuery 代码,可以使用一些第三方插件来实现跳转。例如,可以使用 smooth-scroll 插件来实现平滑滚动到锚点位置。
<script src="https://cdn.jsdelivr.net/npm/smooth-scroll@16.1.3/dist/smooth-scroll.min.js"></script> <script> var scroll = new SmoothScroll('a[href*="#"]'); </script>
这段代码会在页面加载完成后,对所有带有 href 属性并包含 "#" 的链接添加点击事件,点击链接后会平滑滚动到相应的锚点位置。
以上是一些兼容性解决方法,可以根据您的具体情况选择合适的方法来实现跳转。
相关推荐
















