ios系统fixed定位元素滚动后无法点击
2013-11-05 19:20
1211 查看
最近在写一个移动端插件,网页的通讯录。可以根据已有的dom或者json数据,生成一个字母导航和搜索过滤功能。
在开发这个插件的过程中,在ios上发现了一个bug。
当一个元素设置为position: reletive时,再绑定点击事件。会有一个很奇怪的情况。
这个元素第一次可以响应,但是如果发生滚动操作,那么点击事件就再也不响应了。需要再滚动一下滚动条才能再次响应。
网上也没有说照成这个bug的原因。不过有对应的解决方法。方法如下:
可以在dom树的底部,放一个div。当点击事件触发时,先将这个div高度设置成1px,然后再将这个div高度设置成0px。代码如下:
不过这个办法也有问题,如果将div放在文档底部,div高度的变化会导致这个页面的闪动。可以将其放在文档的头部并且将其隐藏起来。
在开发这个插件的过程中,在ios上发现了一个bug。
当一个元素设置为position: reletive时,再绑定点击事件。会有一个很奇怪的情况。
这个元素第一次可以响应,但是如果发生滚动操作,那么点击事件就再也不响应了。需要再滚动一下滚动条才能再次响应。
网上也没有说照成这个bug的原因。不过有对应的解决方法。方法如下:
可以在dom树的底部,放一个div。当点击事件触发时,先将这个div高度设置成1px,然后再将这个div高度设置成0px。代码如下:
$('#device').css('height', '1px'); window.scrollTo(0, letterObj.scrollTop); $('#device').css('height', '0px');
不过这个办法也有问题,如果将div放在文档底部,div高度的变化会导致这个页面的闪动。可以将其放在文档的头部并且将其隐藏起来。
相关文章推荐
- python+selenium 定位到元素,无法点击
- 部分android、ios系统中元素被触摸时产生的半透明灰色遮罩怎么去掉、元素被点击时产生的边框怎么去掉
- 解决 IE6 不支持绝对定位 fixed 以及IE6下被绝对定位的元素在滚动的时候会闪动的问题
- 移动端 position:fixed; 定位在iOS系统上失效,该怎么解决
- selenium实战:如何解决无论如何都无法定位的点击展开元素问题
- 关于webdriver定位元素,报错无法点击
- 定位fixed,使得可点击元素不可点击问题解决
- IOS开发教程--关于点击IPHONE手机标题栏无法滚动到最顶端问题
- ios系统地图无法定位问题
- selenium 元素可以定位到,但是无法点击问题
- fixed定位元素被安卓、ios键盘顶起的解决办法
- iphone下元素放在了一个position: fixed的div中无法点击
- position:fixed的元素定位到滚动区域,会被覆盖
- JS 侧栏导航点击定位页面内容位置及滚动条滚动改变导航元素对应状态
- div盒子position:fixed定位后无法滚动到页面顶部了
- IOS系统对fixed定位支持不好的解决方法
- 关于绝对定位后元素(a标签)无法点击
- ios下当input focus后,滚动元素的position:fixed失效 html的三段式固定fixed结构
- iframe中的modal动态为页面添加元素后页面无法滚动
- 移动端开发ios下body点击事件无法触发的解决方法