Cara Membuat Scroll Horizontal Dan Vertical Pada Postingan

Hai sobat sekalian ketemu lagi dengan ane pada kali ini ane pang share lagi dulu ane perna share tentang Cara membuat scroll pada Blogarchive dan pada kali ane juga masih membahas seputar scroll. Namun kali ini yang ane akan share yaitu tutorial bagaimana cara membuat scroll horizontal dan vertical pada postingan, dengan menggunakan scroll juga dapat menghemat halaman posting juga, jadi tidak memakan banyak tempat. 
Berikut ini pengertian dari scroll : Scrollbar adalah sesuatu yang dapat ditarik ke atas dan ke bawah atau digulung kekanan ke kiri atau ke atas ke bawah sehingga kita dapat menemukan isi yang tersembunyi.  Scroll merupakan fitur penting ketika memakai komputer. Dengan scroll memudahkan kita untuk menaikkan dan menurunkan halaman pada Window explorer ataupun halaman suatu website. 
Mungkin sobat pernah melihat blog yang penuh dengan isinya yang sangat panjang sehingga memperlambat loading blog tersebut. Supaya blog sobat tidak seperti itu, di tips kali ini saya akan menjelaskan cara membuat scrollbar. Dengan begitu kita bisa menghemat pamakaian ruang blog.
Scroll dibagi menjadi 2, yaitu scroll vertikal dan scroll horizontal. Scroll Vertikal yaitu scroll yang bisa atau dapat ditarik ke atas dan ke bawah sedangkan Scroll horizontal merupakan scroll mendatar yang bisa ditarik ke kiri dan ke kanan. 

Scroll Vertikal dan Horizontal
Berikut ini merupakan contoh kode dari scrollbar Horizontal
<div style=”border:1px solid white;width:200px;height:100px;overflow-y:hidden;overflow-x:scroll;”><p style=”width:250%;”>
Dengan menggunakan overflow-x, kita dapat membuat scroll bar ketika kontent pada div ini lebih lebar dari pada kotakan yang kita buat. Dengan menyeting paragraf menjadi 250%, maka hal ini akan membuat content lebih lebar 250% daripada kotakannya – akibatnya hal ini akan memaksakan terjadinya overflow ( menyebabkan munculnya scroll bar ).
</p>
</div>
Atau Bisa juga Pakai script dibawah ini
o   <div  style=”height:150px; width:300px; border:solid 2px orange;overflow:scroll; overflow-y:hidden;overflow-x:scroll;”>
o   <p style=”width:250%;”> Masukan text sobat <p/>
o   </div>
Nb : orange yaitu warna bordernya
Berikut ini adalah contoh dari scroll Horizontal:

Scrollbar adalah sebuah kotak yang dapat digulung kekanan atau ke bawah sehingga kita dapat menemukan isi yang tersembunyi. Mungkin anda pernah melihat blog yang penuh dengan isinya yang sangat panjang sehingga memperlambat loading blog tersebut. Supaya blog anda tidak seperti itu, di tips kali ini saya akan menjelaskan cara menghilangkan sesak tersebut dengan membuat scrollbar. Dengan begitu kita bisa menghemat pamakaian ruang blog. Mau tau caranya? Berikut kode untuk membuat scrollbar: Anda dapat mengatur lebar dan tinggi scrollbar tersebut dengan merubah nilai pada width:80px; height:80px;. Gimana? Sangat mudahkan? Selamat mencoba…

Anda juga bisa mengatur warna kotak, tinggi, serta lebar (Lihat Tulisan berwarna tersebut diatas).
Mudahkan caranya cukup simple kok, kode tersebut sobat pastekan pada postongan sobat pilih tab html jika sudah maka kembali ke tab text lagi. Demikianlah scroll vertical pada postingan selamat berexperiman dan mencoba.
Berikut ini adalah kode scroll Untuk Scroll Vertikal Lihat dibawah ini :
<div style=”overflow:auto; width:100%px; height:200px; padding:10px; border:1px solid white”>
Jika tanpa Setingan “paksaan” di tag paragraf <p>, maka cukup mudah untuk membuat scroll bar vertikal seperti ini.
</div>
Berikut ini contoh dari scroll Vertikal : 

Scrollbar adalah sebuah kotak yang dapat digulung kekanan atau ke bawah sehingga kita dapat menemukan isi yang tersembunyi. Mungkin anda pernah melihat blog yang penuh dengan isinya yang sangat panjang sehingga memperlambat loading blog tersebut. Supaya blog anda tidak seperti itu, di tips kali ini saya akan menjelaskan cara menghilangkan sesak tersebut dengan membuat scrollbar. Dengan begitu kita bisa menghemat pamakaian ruang blog. Mau tau caranya? Berikut kode untuk membuat scrollbar: Anda dapat mengatur lebar dan tinggi scrollbar tersebut dengan merubah nilai pada width:80px; height:80px;. Gimana? Sangat mudahkan? Selamat mencoba…
Itulah tadi kode dari scroll horizontal atau scroll yang mendatar, scroll horizontal bisa di jadikan alternative scroll jika kita tidak mau menggunakan scroll vertical atau scroll berdiri. Selamat mencobanya semoga berhasil yaa
Demikianlah postingan Tentang Cara Membuat ScrollHorizontal Dan Vertical Pada Postingan Semoga bermanfaat bagi sobat sekalian. Dengan memanfaatkan scroll pada postingan akan lebih menghemat sebuah halaman juga mempercepat loading pada halaman website atau blog.  Sehingga blog kita terasa dinamis dan nyaman bagi para pengujung  sekalian.
Berakhirlah sudah pada postingan ini akhir kata semoga sobat sukses selalu. Aamiin . . . .

Leave a Comment

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