(Iklan)
Breaking News
Loading...
Thursday 14 November 2013

Cara Membuat Efek Memudar In/Out Loading Pada Halaman Posting Blogger

20:30
Microsoft Share | Berikut adalah Cara Membuat Efek Memudar In/Out Loading Pada Halaman Posting Blogger | Cara Membuat Efek Memudar In/Out Loading Pada Halaman Posting Blogger | Sebuah efek yang sangat umum di jQuery adalah efek memudar yang menyembunyikan atau menunjukkan suatu elemen dengan memudar, dan kita dapat menggunakannya dalam banyak cara seperti misalnya dalam navigasi blog. Naskah berikut tidak hanya itu, dengan memuat halaman dengan efek memudar ketika kita browsing di link internal yang ada di blog, seperti judul posting, label link, arsip, link navigasi, dll.


Cara Untuk Menerapkan Efek Memudar Sa'at Loading

1) Untuk menempatkan ini efek memudar di blog Anda, pergi ke Template> Edit HTML:



2) Klik di manapun dalam kode area dan mencari (</ head>) tag menggunakan CTRL + F:


3) Lalu, tepat di atas (</ head>) tambahkan kode berikut:

_________________________________________________________

<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js' type='text/javascript'/>
<script type='text/javascript'>
//<![CDATA[
$(document).ready(function() {
$("body").css("z-index", "-10");
$("body").fadeIn(0);

$("a").click(function(event){
event.preventDefault();
linkLocation = this.href;
$("body").fadeOut(500, redirectPage); });
function redirectPage() {
window.location = linkLocation;
}
});
//]]>
</script>
<style>
html {
background-color: #F2F2F2; /* Color fading */
}
</style>

_________________________________________________________


4) Simpan perubahan dan hanya itu. Dalam hijau Anda dapat melihat di mana untuk mengubah warna yang memudar pada loading halaman.

Asli Script menyembunyikan badan halaman saat memuat, saya lebih memilih untuk mengubah properti yang negatif dengan z-index untuk menghindari masalah dengan robot mesin pencari yang dapat mempengaruhi posisi.

Masalah?

Pertimbangkan bahwa efek tersebut dapat meningkatkan waktu loading blog, jadi saya sarankan menggunakan hanya ketika beban blog Anda cepat dan tidak memiliki terlalu banyak script.

Jika Anda sudah menggunakan versi lain dari jQuery menghapus lainnya, hanya menyisakan ini yang akan readed pertama.

Jika Anda menggunakan Mootools atau Scriptaculous, maka Anda harus membuat beberapa modifikasi pada kode agar kompatibel.

Jika Anda memiliki script lain dengan efek memudar, maka bisa mengganggu ini dan Anda mungkin tidak melihat apa-apa pada halaman kecuali warna memudar, dalam kasus seperti itu lebih baik tanpa script ini.

Anda juga dapat menggunakan efek ini hanya pada beberapa link, misalnya, jika Anda ingin hanya muncul ketika Anda mengklik pada judul posting di link navigasi (posting lama dan posting baru), dan pada tab atas, lalu ganti baris ini:

_____________________________________________________

$("a").click(function(event){
_____________________________________________________

Dengan ini:

_____________________________________________________

$(".post-title a, .blog-pager-older-link, .blog-pager-newer-link, .tabs").click(function(event){
_____________________________________________________


Dalam beberapa kasus, halaman dapat memuat untuk beban kedua dan kemudian dengan efek memudar, ini mungkin "normal" karena browser lambat untuk membaca naskah di halaman beban.



(iklan)

1 comments:

 
Toggle Footer