iPhone上的高度不正确

问题描述：

iPhone上报告了显示问题。我一个也没有。我想知道是否有人有任何想法。iPhone上的高度不正确

在我的网站上。这个问题似乎是由网址栏造成的。在Android上，功能$(window).height()返回（屏幕高度 - 网址栏）。在iOS上，它似乎没有这样做。

在我的网站上，我跳过了网页栏。然后我将图像全屏并居中。（由于某些规范限制，我必须使用Javascript）

在Android中，图像被调整大小到屏幕的可见区域。在iPhone上，它们被调整到可用的高度 - 网址栏。这会导致图像太小而底部有间隙。至少这是我对这个问题的理解。

iPhone屏幕截图。

with url bar
与地址栏

without the url bar
没有地址栏

这是我用来调整图像内容。

window.scrollTo(0, 1); 
function setImageSize() { 
    var windowWidth = $(window).width(); 
    var windowHeight = $(window).height(); 

    $('.photo-slide img').each(function() { 
     var width = $(this).attr('data-width'); 
     var height = $(this).attr('data-height'); 

     if (width > windowWidth) { 
      var ratio = windowWidth/width; 
      width = windowWidth; 
      height = height * ratio; 
     } 

     if (height > windowHeight) { 
      var ratio = windowHeight/height; 
      height = windowHeight; 
      width = width * ratio; 
     } 

     var marginTop = 0; 
     var marginLeft = 0; 

     if (windowHeight > height) { 
      marginTop = (windowHeight - height)/2; 
     } 
     if (windowWidth > width) { 
      marginLeft = (windowWidth - width)/2; 
     } 

     $(this).css({ 
      'margin-left':marginLeft+'px', 
      'margin-top':marginTop+'px', 
      'width':width+'px', 
      'height':height+'px' 
     }) 
    }) 
}

有没有人遇到过这个？我该如何解决这个问题，以便在url栏不可见时填充屏幕。

答

如果您在setTimeout中将setImageSize（）设置为100毫秒等，那么iPhone会给您正确的屏幕高度吗？我记得这是前一个问题。或者不能使用window.navigator.userAgent.indexOf（'iPhone'）来检查它是否是iPhone，然后将URL栏高度添加到图像高度？

欢迎来到SO。您应该添加建议/疑难解答作为对问题的评论，除非您有明确的答案提供。有关更多信息，请参阅http://*.com/about和http://*.com/faq。 – Scott 2013-02-28 12:03:09

好的谢谢，并不完全确定它是如何工作的，因为我看不到评论按钮或任何东西。我想我没有足够的代表直接评论这个问题。 – 2013-03-01 11:59:56

iPhone上的高度不正确

相关推荐