相关疑难解决方法(0)

我已经在iPad上固定定位了一段时间.我知道iScroll并不总是有效(即使在他们的演示中).我也知道Sencha有一个修复,但我无法Ctrl+ F修复该源代码.

我希望有人可以有解决方案.问题是,当用户在iOS移动的Safari上进行平移时,固定定位元素不会更新.

问题:基于iOS7 Safari中主屏幕Web应用程序的给定示例,如何实现永不滚动出视图的固定持久标头,以及在敲击时滚动到视图中的输入字段？

这两个示例有一个区别,一个height=device-height在视口中,另一个没有.

没有设备高度

<meta id="viewport" name="viewport" content="user-scalable=no, initial-scale=1, minimum-scale=1" />

演示:http://run.plnkr.co/plunks/SU8Csk/

编辑链接:http://plnkr.co/edit/SU8Csk

好处:固定标题在点击字段时不会改变位置/高度.

坏处:用户无法在不手动滚动或按下"下一步"按钮的情况下看不到聚焦的字段.这可能非常繁琐,尤其是如果字段位于不溢出的页面上.

设备高度

<meta id="viewport" name="viewport" content="width=device-width, height=device-height, user-scalable=no, initial-scale=1, minimum-scale=1" />

演示:http://run.plnkr.co/plunks/rPoyaB/

编辑链接:http://plnkr.co/edit/rPoyaB

好处:用户根据需要滚动到焦点字段.

坏处:固定标题完全滚出视图,这需要始终保持在屏幕上.场景是,它将包含一个取消按钮和一个始终可以访问的保存按钮.此外,当字段模糊时,标题本身看起来被压扁,直到用户将其向下滚动到视图中,但如果禁用溢出,则它们甚至无法执行此操作.

丑陋的:在我的非平凡的真实代码中,远离这些简化的例子,有一堆元素绝对位于标题内以创建曲线"标签"效果,这些元素的对齐完全关闭.

您应该能够在iOS7 Safari中打开每个演示URL,添加到主屏幕,然后启动以演示该问题.

解决这个问题的最佳方法是什么？

注意:我知道iOS7 Safari中存在"错误",特别是涉及到主屏幕Web应用程序时,但我相信可能存在与我如何构建页面相关的解决方法.我做了大量的研究(见下文),但我很难找到解决方案.

"固定标题"问题的相关链接: ios7 +中需要固定标题,如何获得固定标题以保持在页面顶部？, 修复了移动safari网站上的文本字段标题, iOS 5固定定位和虚拟键盘, ipad/iphone上固定页眉,页脚和侧栏的问题, CSS"位置:固定;" 在iPad/iPhone上？, 固定在Mobile Safari中的定位,当在Mobile Safari中打开虚拟键盘时, 如何阻止我的固定导航像这样移动？, web应用程序 - 设备高度/键盘问题 …

可能重复:
Mobile Webkit重排问题

我一直想弄明白这一点.我在ios上有一个固定的页脚,里面有4个链接.它们下面还有6个链接,因为它们位于下方,所以不应该是可点击的.但是在ios上,除非你首先滚动页面,否则固定页脚上的链接不起作用,而是点击它下面的链接.滚动最轻微的一点后它工作正常.我希望我能够清楚地解释这一点.

你可以在这里看到它的一个例子:
amstar.m77950.com
(在iphone上查看)

我尝试将z-index应用于页面上的每个元素,看看是否有修复.我还使用了jquery来确保z-index被应用于onLoad(尽管它本来应该是).

然而,在滚动页面之前,我仍然无法使页脚中的链接工作.

对此的任何帮助都很受欢迎.谢谢.

这是我申请元素的CSS:

.alertsBarClass {
background: url("dynamicimage.aspx?id=21844") no-repeat scroll 0 0 #EA7E25;
border-bottom: medium none;
bottom: 0;
display: block;
position: fixed;
width: 100%;
z-index: 1000;
}