Eksperimen Infinite Scroll dengan JSON Blogger
Eksperimen membuat infinite scroll dengan JSON Blogger. Sebuah sistem yang akan memperbaharui jumlah item posting setiap kali pengguna mencapai batas akhir layar ketika pengguna sedang menggulung halaman. Metode ini sebenarnya sudah pernah Saya tuliskan di sini. Saya mengganti kondisional batas akhir yang tadinya berupa perbandingan antara tinggi kontainer dengan batas akhir gulungan area seperti ini:
container.onscroll = function() {
if ((this.scrollTop + this.offsetHeight) == inner.offsetHeight) {
myFunction();
}
};
Menjadi berdasarkan perbandingan antara tinggi layar dengan batas akhir gulungan layar seperti ini:
window.onscroll = function() {
if (navigator.userAgent.toLowerCase().indexOf("chrome") > -1 || navigator.userAgent.toLowerCase().indexOf("safari") > -1) {
if (document.documentElement.scrollHeight == (document.body.scrollTop + document.documentElement.clientHeight)) {
myFunction();
}
} else {
if (document.documentElement.scrollHeight == (document.documentElement.scrollTop + document.documentElement.clientHeight)) {
myFunction();
}
}
};
Selengkapnya mengenai potongan kode untuk mengecek batas akhir gulungan layar bisa Anda baca di sini.
Silakan dipelajari dan dimodifikasi sesuka hati Anda dengan mengikuti persetujuan yang Saya tuliskan di dalam kode sumbernya. Eksperimen ini akan diperbaharui jika memang ada yang perlu diperbaharui. Begitu.
Labels: Blogger, Eksperimen, JavaScript, JSON
16 Comments:
sejenis load more post tapi versi scroll.. :)
By Unknown, at Saturday, March 2, 2013 at 8:38:00 PM GMT+7
yang repotnya kalo arsip sudah sampe 10 tahunan, ampe kapan kita mau scroll2an :D
gimana kalo ditambahin links arsip \o/
By Beben Koben, at Saturday, March 2, 2013 at 9:38:00 PM GMT+7
napigasi gito loh :)
By Beben Koben, at Sunday, March 3, 2013 at 2:41:00 AM GMT+7
emang lebih cocok kalo di terapkan di arsip.. :D
By Anonymous, at Sunday, March 3, 2013 at 6:15:00 AM GMT+7
ini kayak daftar isinya blog ini :D
By Anonymous, at Monday, March 4, 2013 at 9:42:00 AM GMT+7
eksperimen tp sudah ada di daptar isi ternyata :D
By Beben Koben, at Monday, March 4, 2013 at 7:01:00 PM GMT+7
Kalau yang di daftar isi, pemuatan ulang terjadi saat pengguna mengeklik tombol. Kalau yang ini cuma berdasarkan perhentian gulungan sampai di batas akhir layar.
By Taufik Nurrohman, at Tuesday, March 5, 2013 at 7:22:00 AM GMT+7
lama gak nongol disni udah byk aja kemajuan didunia koding, wah keknya mantap law buat arsip ya bang?
By Mr.Randy, at Sunday, March 17, 2013 at 12:09:00 PM GMT+7
Wah saya sudah pelajari.. tapi saya masih bingung buat nerapin di blog dengan mengganti scrooll dengan tombol.. atau meganti blog-pager dengan fungsi seperti ini mohon pencerahannya atau mungkin ditulisakan di artikrl berikutnya bang taufik.. makasih.
By Sodikin Kurniawan, at Sunday, April 7, 2013 at 6:22:00 PM GMT+7
Pakai plugin Infinite Ajax Scroll ⇒ http://www.thesimplexdesign.com/2013/02/infinite-scrolling-or-load-more-effect.html
By Taufik Nurrohman, at Tuesday, April 9, 2013 at 11:34:00 AM GMT+7
Oke bang makasih.. saya ke tkp dulu...
By Sodikin Kurniawan, at Tuesday, April 9, 2013 at 7:31:00 PM GMT+7
Mas taufik... kalau seperti kAPAN LAGI.COM gimana ya....?
By Unknown, at Sunday, May 12, 2013 at 1:58:00 PM GMT+7
Gan, ane sangat frustasi dengan infinite scroll ini. Dah puluhan kali coba ga pernah berhasil. Ga tau masalahnya dimana... :(
By Niaga88, at Monday, March 10, 2014 at 4:47:00 PM GMT+7
Kalo yang versi load more post ada ?
By najatulwan, at Friday, June 26, 2015 at 12:54:00 AM GMT+7
bisa langsung di gunakan di blogger gan ??
By Giri Diwa Adam, at Saturday, October 7, 2017 at 8:40:00 PM GMT+7
Asumsikan kita punya 10 blog dari Blogger. Dari 10 blog tersebut, dapatkan kita ambil data json dari semuanya, untuk kemudian kita parse bersama-sama (menyeluruh) berdasarkan urutan tanggal posting dari semua blog berjumlah 10 tersebut, dan kita tampilkan sebagai markup html di satu halaman tertentu, misalnya hanya judul, url gambar pertama, potongan artikel, tanggal posting, dan/atau label--kesemuanya tampil sebagai markup html berdasarkan waktu posting setiap blog. Jika ini (maksudnya, mengambil dan parse json dari 10 blog berbeda dan menampilkan pada satu halaman, baik secara infinit skrol atau even klik) dimungkinkan, barangkali akan bermanfaat bagi pengguna Blogger yang suka bereksperimen.
By lutfiyah, at Monday, December 31, 2018 at 8:26:00 AM GMT+7
Post a Comment
<< Home