cara supaya gambar gak gerak ngikutin scrollpane pake CSS


pengen tau nich gimana caranya bikin gambar tetep ditempat.

dan gak gerak walaupun scrollpane browser berubah?

gampang aja, cuma pake CSS, wkkkkkk

langsung aja nich, caranya kita gunain style css :

position: fixed

misal sekarang gw bikin id style agar sebuah div gak bergerak dan disana misal :

#content {
   position: fixed;
   top : 10px;
   right : 10px;
}

lalu di file htmlnya gw bikin div yang berisikan gambar kayak gini :

<div id=”content”>
   <img src=”resource/image/mummy3_poster1.jpg” alt=”echo”>
</div>

sekarang ini contoh gambarnya :

image

sekarag pas scrollpane dirubah gambar mummy akan tetap ditempatnya dan gak berubah :

image

gimana, gampang kan?

sekarang gw jelasin dari kode style dibawah ini :

#content {
   position: fixed;
   top : 10px;
   right : 10px;
}

#content artinya gw bikin style dengan id baru jadi pemangginallnya cukup gunain <div id=”content”>

position:fixed artinya gw bikin setiap komponen html yang memiliki id content ditampilkan fixe yang maksudnya posisinya tetap dan tak kan berubah.

top:10px artinya gw bikin komponen yang pake id content diletakkan 10px dari atas

right:10px artinya gw bikin komponen yang pake id content diletakkan 10px dari kanan

 

trix ini bagus buat bikin banner ato majang foto lo di web supaya keliatan terus

sok_kyut buat narsiz2-an, wakkkkkk

Iklan

9 pemikiran pada “cara supaya gambar gak gerak ngikutin scrollpane pake CSS

  1. mas,sya msh bingung nich cra make’a..
    klo bisa lebih diperjelas lagi cara’a..
    misalnya..
    “#content {
    position: fixed;
    top : 10px;
    right : 10px;
    }”
    itu diletakin dmn?
    dll..
    okeh..

  2. Mbo yah Klo mang dah mengerti tolong dishare ilmunya..kan ada pepatah mengatakan ” sampaikan ilmu walaupun hanya se ayat… Piss

  3. @echo a.k.a pemilik blog
    “haha
    masa gitu aja gak tau πŸ˜€
    kayaknya blum ngerti CSS y?
    mending pelajari apa tuh CSS dulu”

    Iya tau mas…situ dah jago CSS & web..tp ga perlu menertawakan orang lain yang belum tau dan masih belajar…

    Dah lupa ya dulu waktu anda masih buta sama sekali tentang CSS, HTML, internet atau programming??!

    Kliatan banget kalo barusaaan aja bisa CSS

  4. mas echo, mau tanya soal scrollpane ne,, bisa gak kasii tutor tentang ngubah tampilan scrollpane untuk web atau blog,
    saya udah coba, tapi gagal terus.. haiih… bantuin donk mas, hehe πŸ˜€
    atau email saya aja kalo ketemu.. nuhun.. πŸ˜€

Tinggalkan Balasan

Isikan data di bawah atau klik salah satu ikon untuk log in:

Logo WordPress.com

You are commenting using your WordPress.com account. Logout / Ubah )

Gambar Twitter

You are commenting using your Twitter account. Logout / Ubah )

Foto Facebook

You are commenting using your Facebook account. Logout / Ubah )

Foto Google+

You are commenting using your Google+ account. Logout / Ubah )

Connecting to %s