モバイルの問題を避けるために最小の高さを設定する

Question

これが可能かどうかわかりませんが、私の ".nav_menu" divの高さをビューポートの半分に設定する代わりに、 min-heightを設定します。

var menu = jQuery(".nav_menu"); 
    jQuery(window).resize("resizeMenu"); 
    function resizeMenu() { 
    menu.height(jQuery(window).height()/2); 
    } 
resizeMenu(); 

今、私はこのような何かを行うにはしたくない理由...

$('.nav_menu').css("min-height", "50vh"); 

それとも直接CSSで、理由はモバイル上で自分自身を提示し、高さ再計算する問題であることを行いますアドレスバーが非表示になったとき。上記の関数はその問題を回避しますが、min-heightではなくheightで作業するように設定されています。

最終的に私の目標は、上部からスクロールしてブラウザのアドレスバーが隠れて再計算するというアンドロイドの問題を作成せずに、要素の最小高さにVHまたは％単位の値を使用できるようにすることですビューポートのサイズを変更し、％またはVHユニットの出力値を変更します。だから、それに対する解決策は非常に高く評価されています！

Answer 1

機能内でチェックすると問題を解決できますか？それが基本的にはmin-heightのスタイルが何であるかという理由で、要素の高さが必要でない限り設定しないのはなぜですか。何かが好きです：

var menu = jQuery(".nav_menu"); 
jQuery(window).resize("resizeMenu"); 
function resizeMenu() { 
    var windowHeight = jQuery(window).height(); 
    if (menu.height < windowHeight/2){ 
     menu.height(windowHeight/2); 
    } 
} 
resizeMenu();