锚点在iOS Safari上滚动后失去点击能力
使用此来获取点击次数:
$("nav li a").click(function(event) { event.preventDefault(); target = $(this).attr("href").replace('#', ''); goToByScroll(target); });
这是滚动function:
function goToByScroll(id) { $('html, body').animate({ scrollTop: $("#"+id).offset().top - totalHeight }, 'slow'); }
第一次点击的作品,但之后,链接是不可点击/活动,除非手动滚动页面。 有任何想法吗?
在进一步调查iOS的人后,我们发现这是iOS5上Safari的一个bug。
我试过了
// $('html,body').animate({ scrollTop: scrollto + 'px' }, 'slow') window.scroll(0,0);
而且看到它实际上把固定头部画到了屏幕下方。 随着点击工作。
所以我把代码交换回来了,虽然它把头部正确地绘制在顶部,但是主动点击区域仍然在页面的更下方,尽pipe是不可见的,是可点击的。
似乎他们已经解决了在iOS6上testing。
我耗尽了各种CSS和DOM操作,删除和重新插入一个新的标题区…没有任何工作。
所以我99%肯定要发表这个答案。 大声笑。 虽然我意识到这并不能帮助你。
有很多因素可以在这里发挥作用,大多数不涉及你已经链接的代码。 点击不起作用:
- 点击事件正在被清除
- 您尝试点击的元素被另一个(可能是透明的)元素覆盖
- 元素的可点击区域被replace或格式不正确
对于第一个可能性是问题,您的元素将不得不保持不可刷直到刷新或直到您重新创build点击处理程序。 检查点击处理程序是否不是多次构build的。 您可以通过在调用$(element).click(function() { ... })
设置断点或alert / console语句来完成此操作。
对于第二种可能性是这个问题,另一个元素将需要出现在可点击元素之上。 这可以通过使用浏览器或浏览器扩展来检查,使您可以右键单击要检查的元素。 如果被检查的元素不是你的可点击元素,这可能是问题。
对于第三种可能性是这个问题,你将不得不检查可点击元素的位置,大小和形状,而不可点击的元素。 使用浏览器或浏览器扩展程序select并突出显示页面上的元素。 看看它正在显示的位置,它具有什么尺寸, z-index
计算的是什么,它具有什么样的显示属性( display: inline
对引起可点击性的问题是臭名昭着的),如果它在当前是“真正的”视。
简而言之,你发布的代码几乎没有关于可能发生的事情,所以你需要做更多的debugging或者提供更多的代码。