0

WordPress ポートフォリオ サイトに基本的なモーダル ウィンドウを作成するために、twitter ブートストラップからサンプル コードをコピー アンド ペーストしました。

<div class="modal hide fade">
  <div class="modal-header">
  <a href="#" class="btn btn-primary">Save changes</a>
  <a href="#" class="btn">Close</a>
  <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;  </button>
  <h3>Modal header</h3>
  <p>One fine body…&lt;/p>
  </div>
  </div>
  </div>
  <div class="modal-body">
  <div class="modal-footer">
</div>

最初は、ドキュメントの読み込み時にボックスが表示されますが、これは望ましくありません。十字ボタンや閉じるボタンをクリックしても消せません。

連絡先ボタンは、モーダル トリガー ボタンのコードを追加した場所です。

<a href="#myModal" role="button" class="btn" data-toggle="modal">Launch demo modal</a>

このボタンをクリックすると、背景が必要に応じて暗くなり、ボックスを閉じることができます。ただし、このイベントの後、メイン ナビゲーションは使用できなくなります。どこかに単純な対立があると思います。トラブルシューティングの方法に関する提案は大歓迎です。サイトはhttp://sandpit.jonathanbeech.co.uk/です。

4

1 に答える 1

0

これを試して:

  1. hideモーダル div から クラスを削除します。
    <div class="modal hide fade">
  2. idモーダル div に属性を追加します。id="myModal"
于 2014-03-15T06:02:20.253 に答える