前端页面在手机浏览器显示时锚点失效的解决

前端第三方的弹窗控件,点击弹窗的关闭按钮时,有一个锚点的跳转:

location.hash="tag";

但是这个效果只在PC上调试生效,在手机浏览器上,能看到地址栏里有#tag,但是页面没有跳转到指定的位置。

尝试了其他的跳转方式,比如:

document.getElementById('tag').scrollIntoView()
都是不能跳转到指定的锚点。

注意到在点击完关闭按钮后,画面有一瞬的闪烁。怀疑是弹窗消失和滑动到指定锚点冲突。

于是尝试在锚点跳转处加上延时操作:

setTimeout(function(){
    location.hash="tag";
},500);


再调试时,手机上的页面就能过正常跳转到指定的锚点。

你可能感兴趣的:(web前端)