カーソルによるjqueryのポップアップメッセージ

Question

少しのアドバイスの後。私はちょっとしたツールチップ型のものだが、正確ではない。私は場所のすべてのリンクの数でサイトを持っている。これらのリンクがクリックされると、ページの下部にajaxフォームが読み込まれます。一旦読み込まれると、ページはフォームの下にスクロールします。このフォームは時々画面の一番下にあります。すべての井戸と良い。

リンクをクリックすると若干の遅延がありますが、私がしたいのは、カーソルがどこにあっても小さな「読み込み中」メッセージが表示されてカーソルに固定されてから、ロードされたフォーム。

どのようなアイデアをお願いしますか？あなた.ajax()で

Answer 1

これはfiddleのコードでお答えしました。これは、あなたのajax呼び出しの実行中にツールチップを表示/非表示にするためのHTMLとJavaScriptを含みます。

jQueryの使い方は次のとおりです。

$("#ajaxLoader").click(function() { 
    $("#loading").show(); 

    $.ajax({ 
     settings etc. 
     success: function() { 
      $("#loading").hide(); 
     } 
    }); 

}); 

$("HTML").mousemove(function(e) { 
    $("#loading").css({ 
     "top" : e.pageY, 
     "left" : e.pageX + 15 
    }); 
}); 

Answer 2

残りは、この記事であるあなたがbeforeSend

で何かを追加することができます呼び出します。How do you make a picture follow your mouse pointer with jquery?

Answer 3

のuはリンクをロードしているすべてのリンクのための共通のクラスがあるとしましょう。

$('.loading-link').click(function(){ 
$(this).before('<div class="loading">Loading</div>'); 
// Adjust the position here 

// your ajax stuff 
$.ajax() .... 

.... 
success:function(){ 
$('.loading').remove(); 
// scroll to bottom 

} 


});