我正在开发一个单页网站,并且遇到 <a></a>
问题。标签。
我希望当用户单击 Div 时,他们会被带到页面的不同部分。目前我有<a></a>
这样做。
'<a href="#divid">About</a>'
css-tricks.com/examples/SmoothPageScroll/#two 这是我用来滚动页面的一个很好的例子
但每次我将这些标签放置在 div 中的图像周围时,所有 div 单击属性都会停止工作。 示例:
<div id="about-button" class="button">
<a href="#about"><img src="images/menu-about.png"
alt="about" class="button"/></a>
</div>
我可以看出这是由于a
而发生的标签位于 div 顶部。
我的问题是有没有办法制作 <a>
标签位于 div 下方或与 div 并排工作并且仍然有效?
或者如果没有办法实现这一点。我可以做的任何阅读或不使用“”标签导航到页面特定部分的更好方法的示例
最佳答案
你可以尝试这样的事情:
$('a').click(function(e) {
e.preventDefault();
var scr = $('#target').offset().top; // top offset of the target element
$('html, body').animate({scrollTop: scr}, 1000)
})
关于jquery - 使用 <a></a> 滚动单页网站,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/11310951/