Postingan lainnya
Kelas Premium!
Belajar bikin website dari nol sekarang
Gunakan kupon "lebihcepat" untuk diskon 25%!
cara membuat load more seperti instagram
gimana ya caranya membuat foto diawalan tampil hanya 6 , lalu dibawahnya ada tulisan Lihat Lainnya, lalu ketika di tekan tampil terus menerus ketika di scrooling??
ane berhasil buat, tapi untuk diawal ane limit 6, seperti ini scriptnya
<div id="grid-container" class="cbp">
<?php
$queryProject = mysqli_query($link, "SELECT * FROM galeri LIMIT 0,6") or die(mysqli_error());
while($dataProject = mysqli_fetch_array($queryProject)){
?>
<div class="cbp-item <?php echo str_replace(' ','-',$dataProject['nama_galeri']); ?>">
<div class="cbp-caption">
<div class="cbp-caption-defaultWrap">
<img src="img/portfolio/<?php echo $dataProject['gambar_galeri']?>" alt="" class="img-responsive">
</div>
<div class="cbp-caption-activeWrap">
<div class="cbp-l-caption-alignCenter">
<div class="cbp-l-caption-body">
<a href="img/portfolio/<?php echo $dataProject['gambar_galeri']?>" class="cbp-lightbox cbp-l-caption-buttonRight" data-title="<?php echo $dataProject['keterangan_galeri'] ?><br>by Author" >view larger</a>
</div>
</div>
</div>
</div>
</div><?php } ?>
</div>
<div id="loadMore-container" class="cbp-l-loadMore-button">
<a href="loadmore.php" class="cbp-l-loadMore-link">
<span class="cbp-l-loadMore-defaultText">Lihat Lainnya</span>
<span class="cbp-l-loadMore-loadingText">LOADING...</span>
<span class="cbp-l-loadMore-noMoreLoading">NO MORE WORKS</span>
</a>
</div>
dan ini di loadmore.php
<div class="cbp-loadMore-block1">
<?php
$link = mysqli_connect("localhost", "root", "", "database");
/* cek koneksi ke database */
if (mysqli_connect_errno()) {
printf("Gagal Terhubung: %s\n", mysqli_connect_error());
exit();
}
$queryProject = mysqli_query($link, "SELECT * FROM galeri LIMIT 6,15") or die(mysqli_error());
while($dataProject = mysqli_fetch_array($queryProject)){
?>
<div class="cbp-item <?php echo str_replace(' ','-',$dataProject['nama_galeri']); ?>">
<div class="cbp-caption">
<div class="cbp-caption-defaultWrap">
<img src="img/portfolio/<?php echo $dataProject['gambar_galeri']?>" alt="" class="img-responsive">
</div>
<div class="cbp-caption-activeWrap">
<div class="cbp-l-caption-alignCenter">
<div class="cbp-l-caption-body">
<a href="img/portfolio/<?php echo $dataProject['gambar_galeri']?>" class="cbp-lightbox cbp-l-caption-buttonRight" data-title="<?php echo $dataProject['keterangan_galeri'] ?><br>by Author" >view larger</a>
</div>
</div>
</div>
</div>
</div><?php } ?>
</div>
agar otomatis tampil tanpa limit seprti diatas gimana ya caranya??? diawal 6 gambar lalu ketika "Lihat Lainnya" di tekan tampil otomatis gimana yaa??
6 Jawaban:
Jawaban Terpilih
yang ane tangkep dari pertanyaan agan itu adalah "bagaimana cara menampilkan data setelah menekan tombol lihat lainnya" kira-kira seperti itu ???
kalo iya, setau ane gan. kalo mau buat tombol load more/lihat lainnya itu harus pake ajax..
jadi caranya agan harus menggunakan jquery namanya. untuk bisa menggunakan ajax atau bisa juga menggunakan javascript.
contoh penggunaan nya bisa lihat di video tutorial ini gan..
[link]https://www.sekolahkoding.com/kelas/ajax-dengan-javascript-dan-jquery[/link]
sama satu lagi nih gan..
https://www.sekolahkoding.com/kelas/belajar-jquery-dari-dasar
semoga membantu
untuk membtasinyaa apa harus di limit lagi??
mau load more seperti instagram "tanpa click button", atau mau pakai tombol "load more" ?
@ma4m maunyaa pertama di pencet load habis itu otomatis @gunalirezqumauludi makasih bang linknya. masig di coba ni