Memberikan efek blur saat loading halaman website bisa membuat halaman website kita menjadi menarik, kita dapat mengimplementasikannya dengan mudah menggunakan jquery.
div ini adalah bagian yang akan di load saat proses fadein berjalan
<div id="page_effect" style="display:none;"> <!-- this content is hide, need jQuery to fade in --> </div>
Membuat efek jquery fadein saat dokumen ditampilkan.
$(document).ready(function(){
$('#page_effect').fadeIn(2000);
});
Berikut script komplit jquery fadein untuk diterapkan pada halaman website kita:
<html>
<head>
<title>JQuery Page Loading Effect</title>
<script type="text/javascript" src="jquery.js"></script>
</head>
<script type="text/javascript">
$(document).ready(function(){
$('#page_effect').fadeIn(2000);
});
</script>
<body>
<div id="page_effect" style="display:none;">
<h1>JQuery Page Loading Effect</h1>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer semper, nibh sit amet porta lacinia, nunc lacus lobortis turpis, scelerisque tincidunt urna odio id arcu.
Aenean gravida tellus et velit pulvinar sit amet mattis justo accumsan. Vestibulum adipiscing sem in elit accumsan at bibendum nisl dictum. Maecenas velit purus, hendrerit placerat mattis at, porta quis mi. Aenean varius orci sed nisi pharetra posuere. Duis iaculis viverra aliquet. Aliquam vitae consequat magna.
</div> </body> </html>
No Comments on "Page Loading Dengan Jquery"