$(window).height() 在 iPad 全屏网络应用程序中不起作用

发布于 2024-10-07 07:36:39 字数 397 浏览 0 评论 0原文

我正在开发一个 Web 应用程序,该应用程序可以在 iPad 版移动 Safari 中很好地显示。

当快捷方式保存到跳板时,它最终会运行良好,并将正确的元标记放在一起以显示跳板图标、启动屏幕等。

不幸的是,该应用程序使用 $(window).width()$(window).height() 并且经常(并非总是如此,不,我不能说何时,我我对此感到疯狂) $(window).height() 调用返回 0。

我必须知道根据视口大小和方向动态设置图像宽度和高度的大小。该应用程序还使用 jQuery-ui 和 jQGrid,当高度计算为 0 时,它们都会中断。

jq-ui 对话框显示在屏幕顶部而不是中间,并且表格也无法正确显示。

I'm working on a web application that is nicely displayed in mobile Safari for iPad.

It eventually plays well when a shortcut is saved to the springboard, having put together the right metatags for displaying a springboard icon, splash screen and so on.

Unfortunately the app uses $(window).width() and $(window).height() and often (not always, and no, I cannot say when, I'm going crazy about that) the $(window).height() invocation returns 0.

I have to know the size for setting images width and height dynamically according to the viewport size and orientation. The application also use jQuery-ui and jQGrid and, when the height evaluates to 0, they both break.

The jq-ui dialogs displayed on top of the screen instead of in the middle, and the tables are not displaying correctly either.

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(4

海拔太高太耀眼 2024-10-14 07:36:39

可能的解决方法是:

height = window.innerHeight ? window.innerHeight : $(window).height()

在这里找到:http://bugs.jquery.com/ticket/6724

A possible workaround is:

height = window.innerHeight ? window.innerHeight : $(window).height()

Found here: http://bugs.jquery.com/ticket/6724

染柒℉ 2024-10-14 07:36:39

碰巧这不是iPad的问题!搜索了又搜索没有结果,我决定调查一下从iPad发出并由asp.net执行的http请求和响应:结果发现asp.net回复的content-type设置为“application/xhtml+xml”而不是“text/html”,原因是取自 http://mdbf 的“mobile.browser”文件中的错误.codeplex.com 将 iPad application/xhtml+xml 设置为首选MimeType!
将其重置为正确的类型后一切正常。
我在这里回复是为了以防万一有人遇到同样的问题。
顺便说一句,不再支持 mdbf。

It happens that it was not an iPad issue! After searching and searching with no result, I decided to investigate about the http requests and responses issued from the iPad and performed by asp.net: it turned out that asp.net replied with content-type set to "application/xhtml+xml" instead of "text/html" and the reason was in a bug in "mobile.browser" file taken from http://mdbf.codeplex.com that sets for iPad application/xhtml+xml as preferredMimeType!
After reset it to the correct type all works well.
I'm replying here just in case anyone could incur in the same issue.
btw, mdbf is no longer supported.

椒妓 2024-10-14 07:36:39

这是因为视口。在常规屏幕上,它是一个基本的 X x Y 坐标平面。在触摸屏上,将视口想象成一张小纸,您可以在一张大纸(网站)上移动它。以下是一篇文章的简介,可能会有所帮助:

Mobile Safari 使用视口向您显示网站。想象一本书在你面前。拿一张纸,在上面剪一个320×416的正方形,然后把它放在书上。要阅读这本书,请移动纸张并将孔放在您想看到的单词上。这正是 Mobile Safari 视口正在做的事情。当您轻拂和滚动时,您会移动视口,而其后面的网站保持静态。

由于此问题,您可能无法获取所需的值。下面是该帖子的链接。希望这将为触摸屏应用程序的定位提供一些启示

http: //doctyper.com/archives/200808/fixed-positioning-on-mobile-safari/

此外,Lee 是正确的,您需要确保文档已准备好。

It's because of the viewport. On a regular screen, it's a basic X by Y coordinate plane. On touch screen, think of the viewport a small piece of paper that you move around ontop of a large piece of paper (the website). Here's a blurb from a post that might help:

Mobile Safari uses a viewport to show you websites. Imagine a book in front of you. Take a piece of paper, cut a 320×416 square in it, and lay it over the book. To read the book, move the paper around and position the hole over the words you want to see. This is exactly what Mobile Safari’s viewport is doing. When you flick and scroll, you’re moving the viewport around while the website behind it stays static.

Because of this issue, you may have trouble obtaining the values you need. Below is a link to that post. Hopefully this will shed some light on positioning in regards to touch screen applications

http://doctyper.com/archives/200808/fixed-positioning-on-mobile-safari/

Additionally, Lee is correct that you need to make sure that you're document is ready.

过潦 2024-10-14 07:36:39

尝试检查宽度和宽度短暂延迟后的高度 - 例如:setTmeout(300)。

Try checking width & height after a short delay - eg: setTmeout(300).

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文