リセットjqueryの最大高さのデバイスの向きは

Question

を変更したときに、私は、あなたのデバイスの向きに高さを変更するモバイル/タブレットデバイス上で表示する場合、これは https://css-tricks.com/text-fade-read-more/

より多くの機能を読んで、あなたは続きを読む]ボタンをクリックしてください使用していますボックスの大きさが大きすぎる（縦長から横長に）か、または切り取られる（横長から縦長に）。

オリエンテーションが変更されたときにこの高さをリセットする方法はありますか？ これは私が）

<script> 
var jq14 = jQuery.noConflict(true); 
(function ($) { 
    $(document).ready(function() { 
     // your logic 

     var mq = window.matchMedia("(min-width: 767px)"); 

     var $el, $ps, $up, totalHeight; 

     $(".fade-box .button-read-on").click(function() { 

      totalHeight = 0 

      $el = $(this); 
      $p = $el.parent(); 
      $up = $p.parent(); 
      $ps = $up.find("p:not('.read-more')"); 

      // measure how tall inside should be by adding together heights of all inside paragraphs (except read-more paragraph) 
      $ps.each(function() { 
       totalHeight += $(this).outerHeight(); 
       // FAIL totalHeight += $(this).css("margin-bottom"); 
      }); 

      $up 
       .css({ 
        // Set height to prevent instant jumpdown when max height is removed 
        "height": $up.height(), 
        "max-height": 9999 
       }) 
       .animate({ 
        "height": totalHeight 
       }) 
       .click(function() { 
        //After expanding, click paragraph to revert to original state 
        $p.fadeIn(); 

        if (mq.matches) { 
         $up.animate({ 
          "height": 190 
         }); 
        } else { 
         $up.animate({ 
          "height": 210 
         }); 
        } 

       }); 

      // fade out read-more 
      $p.fadeOut(); 

      // prevent jump-down 
      return false; 

     }); 
    }); 

}（jq14）を使用しているコードです。

Answer 1

あなたはjQueryのモバイルからあなたはこのためのjQuery Mobileを必要とします

$(window).on("orientationchange",function(){ 
    //you can get the screen size 
    var windowWidth = $(window).width(), 
    var windowHeight = $(window).height(); 
    //some code 
}); 

注意を姿勢変更を使用することができ、イムわからない、それは通常のjQueryを使って動作しますが、それは一見

を与える価値がある場合

Answer 2

私はこれを試してみてください。迅速な対応のための

window.addEventListener("orientationchange", function() { 
 
    // Announce the new orientation number 
 
    //alert(screen.orientation); 
 
    var windowWidth = $(window).width(); 
 
    var windowHeight = $(window).height(); 
 
    alert("width = " + windowWidth+" " +" height = "+ windowHeight); 
 
\t 
 
}, false);