1

ピクセルではなくパーセント幅を使用してまとめられたレスポンシブレイアウト用のslideToggleメニューバーを作成する必要があります。このため、slideToggle は不安定です。動的な高さ (ピクセル単位) を div に追加するより良い代替手段または動的な方法はありますか?

私が使用している簡単なスクリプトは次のとおりです。

$(document).ready(function() {
  $('.navicon').click(function(){
  $('.nav').slideToggle("slow");
    $(this).toggleClass("show"); return false;

  });
});


<a class="navicon" href="#">MENU</a>

<div class="nav">
<ul>
   <li>A</li>
   <li>B</li>
   <li>C</li>
   <li>D</li>
   <li>E</li>
</ul>
</div>

</div>

.navサイトはレスポンシブで、幅はパーセンテージで設定されているため、高さを固定することはできません

4

1 に答える 1

0

私はスライドが大好きで、そのピクセル依存性が嫌いです。これが私の解決策です：

nav は好きな高さにしましょう。

CSS

div#nav { height:auto; }

ピクセルの高さを見つけ、それに応じて jQ を使用して CSS を変更します。

jQ

var div = $("#nav").height();
$('#nav').css('height', div);
$('#nav').slideToggle("slow");

他の人があなたのスライダーを使用するのではないかと心配している場合は、ページの高さを変更してください。スライドが完成したら、高さをパーセンテージに戻すことができます。

jQ

$('#nav').css('height', '50%');
于 2014-02-25T23:23:33.060 に答える