2017-07-07 17 views
0

.collapse divをトグルするときに、ブートストラップがキャレットの上下の表示を切り替えるデフォルトの方法を見つけることを試みています。ブートストラップv3キャレット位置トグル

だからコードは次のとおりです。

<div class='row'> 
    <div class='col-sm-8'><h3>Select Image</h3></div> 
    <div class='col-sm-4 text-right'><button type='button' class='btn btn-default' data-toggle='collapse' data-target='#image-files' aria-expanded="false"><b class="caret"></b></button></div> 
</div> 
<div id='image-files' class='collapse'> 
    <div class='row'> 
    Content 
    </div> 
</div> 

私は確信している私は、ブートストラップライブラリはが自動的に何とかまでのダウンからキャレットを変更することをどこかで読みました。

もちろん、私はJqueryの行を使用することができますが、ブートストラップに組み込まれていると確信しています。その使い方を知りたいと思います。

+1

* Bootstrap *のデフォルトを使用して解決策があるとは思っていませんが、このボタンの属性を使用して* CSS *コードを追加することができます: 'button [ aria-expanded = true] .caret {border-top:0; border-bottom:4px solid#000; } ' – vivekkupadhyay

+1

私はドキュメント内のステートメントを見つけました:http://getbootstrap.com/css/#helper-classes-carets:_"デフォルトのキャレットはドロップダウンメニューで自動的に逆転することに注意してください。 "それは... - しかし、あなたはCSSでそれを行うことができます。なぜなら、 'open'や' collapsed'のようなクラスはブートストラップによって追加されるからです。 '.open。caret { border-bottom:4pxダッシュ; border-top:none; } ' – Seika85

答えて

0

これはあなたが探しているものであれば内蔵のアップ/ダウンのオプションがあります:

<span class="dropup"> 
    <span class="caret"></span> 
</span> 

(それとも、任意の詳細や他の何かを探している私は、私が理解し、完全にわかりません?あなたの問題は完璧です。)

+0

ああ、これも:https://stackoverflow.com/questions/25368802/how-to-change-the-bootstrap-caret-pointing-direction-on-click-event –

+0

これは:https:///stackoverflow.com/questions/13870746/how-to-change-the-bootstrap-caret-pointing-position –

+0

aaaand this one:https://stackoverflow.com/questions/20760047/upside-down-caret –

関連する問題