检查移动设备分辨率高度的最佳方法

Question

我在HTML5中有表单页面。 页面太多大，所以我增加了一个滚动：jquery.nicescroll

我包的形式<div>并设置了iPhone 4 height:480px和运行niceScroll构造函数。

<div id = "scroller"> 
<form> 
.. 
... 
...... 
</form> 
</div> 

<script> 
$('#scroller').niceScroll(); 
</script> 

它工作正常，但问题是，我应该给每个设备自己高度：（高度40像素）所以它会很好看的设备。 例如：对于Iphone4身高：480px，对于iPhone5：568px，三星S2 533等。

什么是检查设备的高度值的最佳方法，以便在此之后使用它？ 现在我可以检查设备公司userAgent：

navigator.userAgent.indexOf("iPhone") 

但我需要确切地知道模型

Answer 1

只需使用这样的：

$(window).height(); 

读here

Answer 2

/* Smartphones (portrait and landscape) ----------- */ 
@media only screen 
and (min-device-width : 320px) 
and (max-device-width : 480px) { 
/* Styles */ 
} 

/* Smartphones (landscape) ----------- */ 
@media only screen 
and (min-width : 321px) { 
/* Styles */ 
} 

/* Smartphones (portrait) ----------- */ 
@media only screen 
and (max-width : 320px) { 
/* Styles */ 
} 

/* iPads (portrait and landscape) ----------- */ 
@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px) { 
/* Styles */ 
} 

/* iPads (landscape) ----------- */ 
@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px) 
and (orientation : landscape) { 
/* Styles */ 
} 

/* iPads (portrait) ----------- */ 
@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px) 
and (orientation : portrait) { 
/* Styles */ 
} 

/* Desktops and laptops ----------- */ 
@media only screen 
and (min-width : 1224px) { 
/* Styles */ 
} 

/* Large screens ----------- */ 
@media only screen 
and (min-width : 1824px) { 
/* Styles */ 
} 

/* iPhone 4 ----------- */ 
@media 
only screen and (-webkit-min-device-pixel-ratio : 1.5), 
only screen and (min-device-pixel-ratio : 1.5) { 
/* Styles */ 
} 

请设置在此代码multipal设备的高度。