ブートストラップアコーディオンはマウスオーバー時にデータを表示

Question

これは標準のブートストラップアコーディオンです。私は見出しのマウスオーバー時に次のセクションに切り替えるようにしようとしています。私は隠すために実行する最初のコマンドを得ることができますが、2番目のショーはすべてを変更します。私はちょうどその下のヘッダーに関連するコンテンツを表示したい。

ありがとうございました！

<script type="text/javascript"> 
$("#accordionuser .panel-heading").mouseover(
    function() { $('#accordionuser .panel-collapse').collapse('hide'); 
        $('#accordionuser .panel-collapse').collapse('show'); 
         } 
); 
</script> 

<div class="panel-group" id="accordionuser"> 
    <div class="panel panel-default"> 
    <div class="panel-heading"> 
     <h4 class="panel-title"> 
     <a data-toggle="collapse" data-parent="#accordionuser" href="#collapse1"> 
     Collapsible Group 1</a> 
     </h4> 
    </div> 
    <div id="collapse1" class="panel-collapse collapse in"> 
     <div class="panel-body">Lorem ipsum dolor sit amet, consectetur adipisicing elit, 
     sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad 
     minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea 
     commodo consequat.</div> 
    </div> 
    </div> 
    <div class="panel panel-default"> 
    <div class="panel-heading"> 
     <h4 class="panel-title"> 
     <a data-toggle="collapse" data-parent="#accordionuser" href="#collapse2"> 
     Collapsible Group 2</a> 
     </h4> 
    </div> 
    <div id="collapse2" class="panel-collapse collapse"> 
     <div class="panel-body">Lorem ipsum dolor sit amet, consectetur adipisicing elit, 
     sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad 
     minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea 
     commodo consequat.</div> 
    </div> 
    </div> 
    <div class="panel panel-default"> 
    <div class="panel-heading"> 
     <h4 class="panel-title"> 
     <a data-toggle="collapse" data-parent="#accordionuser" href="#collapse3"> 
     Collapsible Group 3</a> 
     </h4> 
    </div> 
    <div id="collapse3" class="panel-collapse collapse"> 
     <div class="panel-body">Lorem ipsum dolor sit amet, consectetur adipisicing elit, 
     sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad 
     minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea 
     commodo consequat.</div> 
    </div> 
    </div> 
</div> 



     </div>  
    </div> 
</div> 

Answer 1

私は本当にあなたを理解していないが、私は、これはあなたの問題を解決することを願っています：

$('#accordionuser .panel-collapse').collapse('hide'); 
$(this).parents('.panel').find('.panel-collapse').collapse('show'); 

デモ： https://jsfiddle.net/yavxazv6/