jQuery动画中断空格滚动
jQuery动画中断空格滚动
提问于 2016-04-25 09:48:53
因此，空格滚动是一个典型的，如果不是常用的浏览器功能。我注意到，当使用jQuery触发滚动时，这个功能已经中断(请参阅嵌入在“全屏”上)。还有其他人遇到这个问题吗？如果是的话，你是如何解决的？
$('button').click(function () {
$('html, body').animate({
scrollTop: $(window).height()
}, 600);
});body {
border: 1px solid red;
height: 600vh;
}
div {
margin-top: 100vh;
height: 50vh;
background-color: green;
}<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<button>click me to scroll!</button>
<div>scroll to this section</div>
在OSX和jQuery v2.1.4上使用Chrome 49.0.2623.112
回答 1
Stack Overflow用户
回答已采纳
发布于 2016-04-25 10:15:16
我认为你看到的问题是按钮上的focus有问题。当动画事件触发时，页面会滚动，但焦点仍停留在click me to scroll按钮上。当您按空格键时，它会再次触发按钮事件，因为它仍然是焦点事件。
如果您删除按钮焦点，滚动与空格似乎是正确的。
$('button').click(function () {
$('html, body').animate({
scrollTop: $(window).height()
}, 600);
$(this).blur();
});页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/36847604
复制相关文章
相似问题
腾讯云开发者
