1. ホーム
  2. 質問と答え
  3. jqueryローディングモーダル関数が終了しないうちに

jqueryローディングモーダル関数が終了しないうちに

2017-01-18 4 views

答えて

1

あなたの質問には、理解を深めるためにもう少し説明してください。 «その意志の基本的な例を

をbpopup使用する方法loading model

訪問このリンク

： 私はあなたの質問ここ

リンクのためのあなたの答えを得るでしょう、私の与えられたリンクを経由して行くと思います起動時にbPopupをトリガーするクリックイベントをバインドします。 jQueryコアlib（1.3.xより新しい）およびbPopupへの参照を追加します。 bPopupにホットリンクしないでください。

<script src="http://ajax.googleapis.com/ajax/libs/jquery/x.x.x/jquery.min.js"></script> 
    <script src="jquery.bpopup-x.x.x.min.js"></script>

マークアップ：ポップアップ表示するボタン+要素を追加します。

<html> 
     <head> ... </head> 
     <body> 
      ... 
      <!-- Button that triggers the popup --> 
      <button id="my-button">POP IT UP</button> 
      <!-- Element to pop up --> 
      <div id="element_to_pop_up">Content of popup</div> 
      ... 
     </body> 
    </html>

CSS：あなたは、ページの読み込みにポップアップする要素を非表示にします。

<style> 
#element_to_pop_up { display:none; } 
</style>

魔法：ポップアップをトリガーするボタンをクリックイベントをバインド。

// Semicolon (;) to ensure closing of earlier scripting 
    // Encapsulation 
    // $ is assigned to jQuery 
    ;(function($) { 

     // DOM Ready 
     $(function() { 

      // Binding a click event 
      // From jQuery v.1.7.0 use .on() instead of .bind() 
      $('#my-button').bind('click', function(e) { 

       // Prevents the default action to be triggered. 
       e.preventDefault(); 

       // Triggering bPopup when click event is fired 
       $('#element_to_pop_up').bPopup(); 

      }); 

     }); 

    })(jQuery);

OR

;(function($) { 
     $(function() { 
      $('#my-button').bind('click', function(e) { 
       e.preventDefault(); 
       $('#element_to_pop_up').bPopup({ 
        appendTo: 'form' 
        , zIndex: 2 
        , modalClose: false 
       }); 
      }); 
     }); 
    })(jQuery);

リンクデモLink here

出典

2017-01-18 11:40:09

+0

のためにこれはコメントではなく、答えなければなりません。 –

+0

@RoryMcCrossan私はそれのためのコードを書いています。あなたはそれを間違ってマークしました –

+0

私はあなたが何を意味するか分からないのですか？ –

関連する問題

 関連する問題