Membuat back to top sederhana dengan HTML ~ Belajar-Code

Membuat back to top sederhana dengan HTML

Back to top merupakan sebuah tombol yang jika di klik maka halaman akan bergulir ke arah paling atas, Kali ini kita akan membuatnya dalam bentuk yang sederhana.

Langkah pertama yang harus dilakukan adalah menambahkan CSS back to top. Masukan kode CSS dibawah ini:

<style type='text/css' scoped='scoped'>
#BounceToTop{position:fixed; bottom:0px; right:3px; cursor:pointer;display:none}
</style>

Lalu setelah menambahkan CSS kita tinggal memanggil ID CSS yang sudah dibuat tadi dengan memasukan kode berikut:

<div id='BounceToTop'><img alt='Back to top' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiZHs3ULbRz_rXypCDGR9NMJs4c3cNUPbBN5HVSls2eOXds4YoiMWmSrk6B5ZKfV_pREHBBNSspqCAHZHaQkJ1sJDYSNqMP_W5inhRb1SjpN7RVYYGTMQyDFw4N8zvSs_VSJOxCW9rdargf/s1600/to+top.png'/></div>

Dan tombol back to top sudah bisa digunakan.

Terima kasih telah membaca artikel tentang Membuat back to top sederhana dengan HTML di blog Belajar-Code jika anda ingin menyebar luaskan artikel ini di mohon untuk mencantumkan link sebagai Sumbernya, dan bila artikel ini bermanfaat silakan bookmark halaman ini diwebbroswer anda, dengan cara menekan Ctrl + D pada tombol keyboard anda.