2016-04-01 6 views
0

私は新しいフロントエンドの開発者です。モーダルをモーダルで使用しています。私の最初のモーダルは、コンテンツ全体を見るためにスクロールする必要のある長いモーダルです。2番目のモーダルを閉じた後、モーダルをモーダルで使用し、スクロールはボディを指します

<a data-toggle="modal" data-target="#modalmessage1"><button class="btn btn-gold tdc-width-100 tdc-mt-10" ><img class="img-button-icon" src="<?php echo base_url();?>img/email-white.png">SEND MESSAGE</button></a> 

問題がある:第モーダルが閉じている場合。スクロールは本文を参照します。最初のモーダルをスクロールしてコンテンツ全体を見ることはできません。

質問:質問:2番目のモーダルを閉じた後、最初のモーダルのスクロールを有効にするにはどうすればよいですか?

+0

ブートストラップが積層モーダルをサポートしていない、あなたは – Shehary

答えて

1

ブートストラップを扱うモーダルを重ね、最も一般的な問題はmodal-open<body>

の両方から削除するので消えるスクロール、第二モーダルを閉じた上で最初のモーダル

  • の後ろに表示されて

    1. 第二モーダルオーバーレイされていますbootstrapによって提案されるような問題を解決することができます。

      複数の開いているモダールはサポートされていません
      モーダルは開いたままにしておいてください。一度に複数のモーダルを表示するにはカスタムコードが必要です。

      $(document).ready(function() { 
          $('secondmodalselector').on('show.bs.modal', function() { 
           $('firstmodalselector').css('z-index', 1039); //this will push the first modal overlay behind second modal overlay 
          }); 
      
          $('secondmodalselector').on('hidden.bs.modal', function() { 
           $('firstmodalselector').css('z-index', 1041); //bring back the first modal overlay to it's normal state when 2nd modal closed 
           $('body').addClass('modal-open'); // add `modal-open` class back to body when 2nd modal close so first modal will be scrollable 
          }); 
      }); 
      
  • +0

    はあなたに感謝この問題を解決するためのカスタマイズされたアプローチが必要です。病気私のプロジェクトでこのコードを試して:) –

    関連する問題