teratail header banner
teratail header banner
質問するログイン新規登録

回答編集履歴

3

修正

2015/11/07 11:52

投稿

Ken.sakanakana
Ken.sakanakana

スコア1768

answer CHANGED
@@ -27,6 +27,6 @@
27
27
  </div>
28
28
 
29
29
  </div> <!-- modal-content -->
30
- </div> <!-- modal-dialog -->
30
+ </div> <!-- modal-dialog -->
31
-
31
+ </div> <!-- modal fade -->
32
32
  ```

2

加筆

2015/11/07 11:52

投稿

Ken.sakanakana
Ken.sakanakana

スコア1768

answer CHANGED
@@ -1,7 +1,10 @@
1
- ブロックの構成は以下のような感じです。 data-target のIDにjQueryの様に、#を付けてみてください。
2
- ここで指定するIDは画面を出す class="modal fade" で指定されたDIVに付けたIDととなります。
3
- こちらIDに#はいりません
1
+ ブロック構成以下のような感じです
4
2
 
3
+ ボタンの data-target のIDにjQueryの様に、#を付けてみてください。(例では data-target="#MODAL1" です)
4
+
5
+ ここで指定するIDは画面を出す class="modal fade" で指定されたDIVに付けたIDに紐づきます。
6
+ ただ、モーダル側DIVのIDには#はいりません。(例では id="MODAL1"です)
7
+
5
8
  [こちらのガイド](http://bootstrap3-guide.com/javascript/modal.html)がとてもわかりやすいです
6
9
 
7
10
  ```HTML

1

表示の崩れ修正

2015/11/07 11:49

投稿

Ken.sakanakana
Ken.sakanakana

スコア1768

answer CHANGED
@@ -14,10 +14,10 @@
14
14
  <div class="modal-content">
15
15
 
16
16
  <div class="modal-header">
17
- ヘッダ
17
+ ヘッダ
18
18
  </div>
19
19
  <div class="modal-body">
20
- ボディ
20
+ ボディ
21
21
  </div>
22
22
  <div class="modal-footer">
23
23
  フッター