Mempercantik Halaman Website Dengan Efek Loading

Mungkin diatara temen – temen pengujung dokumenary.net ada yang belum tau gimana sih caranya bikin loading yang bagus pada halaman website kita, disini saya akan berbagi cara sederhana yang bisa temen – temen gunakan untuk membuat hal tersebut, caranya mudah sekali tapi hasilnya huummm syupperr…

Temen – temen bisa mencobanya terlebih dahulu di SINI.

Gimana, sudah dilihat? bagus ya… Loading ini dapat memberikan informasi kepengujung sudah berapa persen halaman terload, saya rasa sangat perlu digunakan pada website yang memiliki konten – konten yang berat seperti video, gambar yang berukuran besar dan banyak. Dan efek loading tersebut akan kita buat dengan javascript libaray yang sudah
tersedia yang bernama PACE.

Berikut cara mendapatkan resource pace :

1. Kunjungi website resminya di http://github.hubspot.com/pace/docs/welcome/
2. Download file pace.min.js di sini https://raw.github.com/HubSpot/pace/v1.0.0/pace.min.js
3. Atur warna jika ingin warna yang berbeda
4. Pilih theme yang kamu suka dan download

Cara memasangnya kita tinggal panggil pace.min.js dan file css nya dan taruh sebelum tag </head> seperti berikut :

[php]
<head>
<script src="/pace/pace.js"></script>
<link href="/pace/themes/pace-theme-barber-shop.css" rel="stylesheet" />
</head>
[/php]

Sekarang coba anda refresh, taraaaaa…
Selain cara diatas, kita juga dapat menginstall pace melalui eager


Silahkan temen – temen pencet tuh link diatas, maka akan diarahkan ke website eager, disana kita bisa tinggal memeberikan alamat website yang akan menggunakan pace, setelah itu
akan diberikan link js yang ditaruh juga sebelum tag </head>.

Keuntungan pake eager adalah, kita tidak perlu upload file resource pace.min.js dan css nya ke hosting kita, tentunya sangat berguna sekali bagi pengguna blogspot dan sejenisnya ya.
Selain itu pada eager juga terdapat App Store, jadi kita bisa menginstall aplikasi lainnya semacam Share, Contact Form, Google Map dan lain-lain yang secara otomatis akan tampil pada alamat website yang telah diatur.

Ya sekian tulisan kali ini, semoga dapat memberikan pencerahan buat temen – temen ya, aamin…

Like facebook dokumenary atau subscribe ya, biar selalu dapat info-info terbaru.

Terimakasih

Category: Javascript

Tags: , , , ,

Comments

  1. Hello,

    I’m Abi, an English SEO copywriter and content writer. I excel in crafting blogs, articles, e-commerce product descriptions, SEO content, website content, business service descriptions, newsletter content, brochures, proofreading, social media captions, LinkedIn content, and SOPs.

    My rate is USD 20 for every 1000 words of content. If you don’t have time to plan out your content, we can help you with that.

    Feel free to email me at [email protected] with any current requirements.

    Thanks,

    Abi

    Reply
  2. Hey it’s Sage, here is the free AI tool that automatically writes copy to drive traffic and calls

    Go to:
    http://www.autoSEOcontent.com

    Hope it helps

    Reply
  3. lipitor order buy atorvastatin 10mg pill lipitor generic

    Reply
  4. purchase cipro without prescription – buy cephalexin 250mg generic order augmentin 625mg generic

    Reply
  5. cipro sale – generic cipro augmentin 625mg usa

    Reply
  6. buy flagyl 400mg – cefaclor oral buy zithromax medication

    Reply
  7. order generic ciplox – tindamax brand order erythromycin online

    Reply
  8. where can i buy valtrex – buy vermox without prescription order acyclovir without prescription

    Reply
  9. ivermectin pills – sumycin cheap order sumycin 500mg for sale

    Reply
  10. buy metronidazole 400mg online – cleocin 300mg generic zithromax buy online

    Reply
  11. ampicillin without prescription buy penicillin tablets cheap amoxil for sale

    Reply
  12. buy furosemide medication – how to get coumadin without a prescription captopril pills

    Reply
  13. order glucophage 1000mg online – order glucophage online cheap lincocin 500mg

    Reply
  14. order retrovir 300mg without prescription – order irbesartan pills zyloprim price

    Reply

Leave a Reply

Your email address will not be published / Required fields are marked *