scrollTop 以编程方式更改后固定位置按钮上的移动 Safari 错误...? [英] Mobile Safari bug on fixed positioned button after scrollTop programmatically changed...?

查看:29
本文介绍了scrollTop 以编程方式更改后固定位置按钮上的移动 Safari 错误...?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我刚刚完成了一个网页,但 Mobile Safari(iPhone 和 iPad iOS 5.0.1)中存在一个错误,其中两个按钮固定在右上角和右下角..

I'm just about done a webpage but there is one bug in Mobile Safari (iPhone and iPad iOS 5.0.1) with two buttons that are fixed to the upper and lower right corners..

直到在打开页面其余部分的文本框上单击提交后,按钮才会淡入...在页面的其余部分加载并且按钮淡入后,您可以单击其中任何一个并他们都工作......

The buttons are not faded in until after clicking submit on a textbox which opens up to the rest of the page... After the rest of the page is loaded and the buttons are faded in you can click on either of them and they both work...

但是,单击它们会导致程序化滚动,并且在滚动完成后,您无法再单击任何一个按钮,除非您用手指物理滚动页面,即使只是微小的一个像素滚动...

However, clicking them causes a programmatic scroll and after that scroll is complete you can no longer click on either of the buttons until you physically scroll the page with your finger even just a tiny one pixel scroll...

我注意到的是,在程序化滚动之后,如果您点击 TOP 按钮略下方,您会看到高亮显示,就像您点击 BOTTOM 按钮一样,并且底部按钮的操作已处理,这告诉我错误是当以编程方式滚动时,固定位置按钮仍然与页面的其余部分一起移动,并且在执行实际的触摸滚动之前不会回到它的固定位置......

What I have noticed is that after the programmatic scrolling if you tap just slightly below the TOP button you see the highlight as if you were tapping the BOTTOM button and the action of the bottom button is processed, which tells me the bug is that when scrolling programmatically the fixed position button still moves with the rest of the page and doesn't go back to it's fixed position until an actual touch scroll is performed....

有没有人知道解决这个问题的方法..?

Does anyone know a way around this..?

我添加了一个弹出窗口,显示按下了哪个按钮,因此您可以对其进行测试,记住在第一次按下向下按钮(有效)后尝试再次按下,它不会起作用,但点击正下方向上按钮,您会看到正在发生的向下按钮操作....

I've added a popup that shows which button was pressed so you can test it, remember after the first press of the down button (which works) trying pressing down again, it won't work, but click just below the up button and you'll see the down button actions happening....

http://www.tsdexter.com/ceos

感谢您的帮助.

托马斯

(如果您能指出我可以向 Apple 提交错误的地方,那也很好,除非已经提交过)

(also if you can point me to where I can submit a bug to Apple that'd be good too, unless one already has been)

只需单击任一提交箭头,您无需输入具有默认值的工资/薪水

just click either of the submit arrows, you don't need to enter a wage/salary it has defaults

编辑 2:这是一个更简单的示例来显示相同​​的问题..

EDIT 2: Here is a simpler example to show the same issue..

http://www.tsdexter.com/MobileSafariFixedPosBug.html

编辑 3:向 Apple 报告错误

EDIT 3: Bug reported to Apple

推荐答案

我通过添加一个 101% 高的 div 然后(几乎)立即删除它来解决它.

I got around it by adding a 101% high div then (almost) immediately removing it.

试试:

<style>
.iosfix {
  height: 101%;
  overflow: hidden;
}
</style>

当你滚动时:

window.scrollTo(0, _NEW_SCROLLTOP_);
$('body').append($('<div></div>').addClass('iosfix'));
setTimeout(function() {
  $('.iosfix').remove();
}, 500);

它也适用于 jQuery.scrollTo.

It also works with jQuery.scrollTo.

此处查看示例.

这篇关于scrollTop 以编程方式更改后固定位置按钮上的移动 Safari 错误...?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆