loading dengan ajax

Jika kita membuat aplikasi web dan melibatkan javascript tentunya saat meload data dalam browser tidak akan terlihat sedang loading. Nah bagaimana cara membuat tampilan loading ketika sedang menunggu data yang sedang diload menggunkan javascript. setelah mencoba saya menemukan secript dibawah ini :

<script type="text/javascript">
$(function() {
$('#loading').ajaxStart(function(){
$(this).fadeIn();
}).ajaxStop(function(){
$(this).fadeOut();
});

$('#menu a').click(function() {
var url = $(this).attr('href');
$('#content').load(url);
return false;
});
});
</script>

setelah membuat javacript selanjutnya membuat html yang akan menampilkan proses login :

<div id="loading" style="display:none"><img src="images/loading.gif" /><br />Mohon tunggu. Data sedang dimuat.....</div>

keterangan :

"#menu" adalah proses yang dijalankan atau data yang diload menggunakn javascript menggunakan id menu, html dengan id menu memang tidak ditulis, disesuaikan dengan proses yang dijalankan. Tambahkan gambar gif agar menunggu saat proses login terlihat lebih mnarik. file gif tersebut diload menggunakan <img src="images/loading.gif" /> sesuaikan alamat dalam penyimpanan file gif.

Begitulah yang dapat saya tuliskan, saya tidak pandai dalam menulis. karena itu saya mulai belajar sedikit demisedikit, semoga akan leih baik dan tentunya sekrang masih banyak kesalahan saya mohon maaf yang sebesar-besarnya :)