7

我有一个使用 jQuery(window).height() 的整页幻灯片,它在大多数浏览器上都可以正常工作,但是我在我的手机(Android 浏览器和 Dolphin)上查看了它,幻灯片不断增长,远远超出了视口。这是我的代码:

var height = jQuery(window).height();
jQuery('.slide').each(function(index, element) {
    if(height > 600) jQuery(this).height(height);
    else jQuery(this).height(600);
});
jQuery(window).on('resize orientationChanged', function() {
    jQuery('.slide').each(function(index, element) {
        if(height > 600) jQuery(this).height(height);
        else jQuery(this).height(600);
    });
});

有什么想法可能导致它吗?

谢谢。

4

3 回答 3

7

所以在这个问题问了 3 年后,jquery 窗口高度仍然不能在移动设备上工作,只需用 javascript 替换 jquery,它就对我有用。

替换jQuery

var bodyh = jQuery("body").height();
var windowh = jQuery(window).height();

用 javascript

 var bodyh = document.body.clientHeight;
 var windowh = window.innerHeight;
于 2015-10-21T22:45:22.307 回答
1

如果 HTML 文档没有 DOCTYPE 声明,则它不是有效的 HTML。如果在窗口上未指定 doctype,则 JQuery 无法正确计算窗口高度/文档高度。

该声明是对 Web 浏览器的指示,说明您的页面中使用的 HTML 版本。

因此,如果您没有指定它,请将 DOCTYPE 声明添加到您的 HTML 页面并查看输出。

<!DOCTYPE HTML>
<html>
   //...
</html>
于 2014-06-30T11:36:08.767 回答
0

html 文档类型可能存在问题。这是移动设备的示例文档类型。在您的代码中更改它并尝试。

<!DOCTYPE html> 
<html> 
<head> 
    <title>My Page name</title> 
    <meta name="viewport" content="width=device-width, initial-scale=1">

请参阅下面的链接更多详细信息。 http://www.microsoft.com/en-GB/developers/articles/jquery-mobile-101

于 2014-06-30T12:00:30.977 回答