リストを選択するホバードロップダウン？

Question

私は答えを見ていた：jQuery Drop Down Hover Menu

最初に、そこに提供された回答に感謝します。私はこれを、ユーザーが自分の仕事に簡単にアクセスできるようにするために使用する絶えず進化し続けるツールの中でこれを実現することができました。

しかし、前回のフォーラムで回答したくないという質問がありました。フォーラムの使用方法ではありません。

このツールでは、マウスオーバー時にドロップダウンがドロップされるように指定したこのツールには、<select>ドロップダウンがいくつかあります。それは<li>に<select>から変更せずに、選択リストのホバードロップダウンを行うことは可能です：だから、私はこれを表示するには、このコードを変更：私が私の最初の質問があると思いますので、

$(".DDM").hover(function() { 
 
    $(this).find('ul, select').stop(true, true).slideDown('medium'); 
 
}, function() { 
 
    $(this).find('ul, select').stop(true, true).slideUp('medium'); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div class="DDM"> 
 
    <select class="DDM"> 
 
    <option>1</option> 
 
    <option>2</option> 
 
    <option>3</option> 
 
    </select> 
 
</div>

動作していないのですか？ ？

Answer 1

あなたは、項目の数を取得し、サイズを調整することができます：あなたはあまりにも多くのオプションを持っている場合はサイズに制限しなければならない場合があり

$('.DDM').hover(function(){ 
var count = $(this).children().length; 
$(this).attr('size', count); 
}, 
function(){ 
$(this).removeAttr('size'); 
}); 

。

Answer 2

はい、非常に一般的にあなたが表示されますドロップダウンメニューが<ul>と<li>タグを使用して作成したが、同じ機能が（調整を）<div>または<select>に来ることができます。あなたは、このような相互作用の経験が豊富になるまで、一つの方法を選択してそれに固執する必要があります。試してください、

$(".myClass").on({ 
    'mouseenter':function() { $('#myMenu').slideToggle(); }, 
    'mouseleave':function() { $('#myMenu').slideToggle(); } 
}); 

これは、子要素を含むドロップダウンを切り替えます。