3

モーダルが表示されたときにモーダル内の何もクリックできないように見える理由を理解しようとしています(モバイルデバイスでは-PCブラウザーでは正常に動作します)。Twitterブートストラップの基本的なモーダルである次のようなコードがあります。

<!-- Modal -->

<div id="myModal" class="modal hide fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
    <div class="modal-header">
      <button type="button" class="close" data-dismiss="modal" aria hidden="true">×</button>
      <h3 id="myModalLabel">choose!</h3>
    </div>
    <div class="modal-body">
      <div class="row-fluid">
       <form>
         <fieldset>
             <select class="input-large">
             <option value="0">10:15</option>
             <option value="1">12:45</option>
             <option value="2">13:15</option>
            </select>
         </fieldset>
       </form>
     </div>
   </div>
   <div class="modal-footer">
      <button class="btn pull-left" data-dismiss="modal" aria-hidden="true">Close</button>
      <button class="btn btn-primary">Save changes</button>
   </div>
</div> <!-- modal END -->

そして、このモーダルはJavaScriptイベントによって開かれます。それは十分に開きますが、私の電話では、ボタンをクリックしたり、選択フィールドを押したりすることはできません (または、いつも逃しますか?)。それについて何か考えはありますか？

助けてくれてありがとう。

4

2 に答える 2

3

解決策が見つかりました..誰かが同じ問題を抱えている場合。モーダルに「アクティブ」クラスを追加したところ、問題なく動作しています。

class="modal hide fade active"
于 2013-04-04T08:22:54.663 に答える
3

私も同じ問題を抱えていました。これは (私の場合は v2.0.3) が含まれていることが原因でありbootstrap-responsive.css、入力フィールドをタップしてキーワードがポップアップしたときに、モーダルの適切な表示とその編集の両方に影響します。このStackOverflow の質問で提示されたパッチを次のように少し変更しました。

.modal { 
    position: fixed; 
    top: 20px !important; 
    right: 3%; 
    left: 3%;
    width: auto; 
    margin: 0; 
}

@media (max-width: 480px)とメディアクエリの両方で、@media (max-width: 767px)うまく機能しているようです。

于 2013-05-13T22:36:16.010 に答える