TrikMITOS-blog seputar informasi, islami,kesehatan, kecantikan Tips dan Trik android kord gitar dll

Loading
Tuesday 23 November 2010

Membuat Floating Image Scroll Top And Down Page

Membuat Floating Image Scroll Top And Down Page -Assalamu Alaikum WR.WB Hallo sahabat TrikMITOS-blog seputar informasi, islami,kesehatan, kecantikan Tips dan Trik android kord gitar dll, Pada Artikel yang anda baca kali ini dengan judul Membuat Floating Image Scroll Top And Down Page, saya telah mempersiapkan artikel ini dengan baik untuk anda baca dan ambil informasi didalamnya, yang mungkin bermanfaat buat anda. mudah-mudahan isi postingan Artikel Aksesoris Blog, Artikel Blogger JQuery, Artikel Blogger Tutorials, yang saya tulis ini dapat anda pahami, karna mungkin dari beberapa pengunjung bahasa atau tulisan saya ini agak sulit di mengerti...hehehe benarkah??!!!. baiklah, tanpa panjang lebar dan bertele-tele lagi selamat membaca, jangan lupa baca juga artikel lainnya, karena masih banyak artkel yang menarik lainnya yang menurut saya pribadi sangat bermanfaat

Judul : Membuat Floating Image Scroll Top And Down Page
link : Membuat Floating Image Scroll Top And Down Page
Gambar dibawah ini

Baca juga


Membuat Floating Image Scroll Top And Down Page

Membuat Floating Image Scroll Top And Down PageTutorial kali ini kita akan belajar Membuat Floating Image Scroll Top And Down Page dengan bantuan penambahan script dan frame work javascript dari JQuery. Sehingga ketika tombol link perintah itu diklik maka pergerakan keatas dan kebawahnya akan lebih aktraktif dan menarik. Untuk mencobanya, silahkan klik tombol love perintah keatas dan kebawah yang berada pada pojok kanan bawah dari blog ini!

Bagaimana? Tertarik untuk mencoba membuat tombol perintah dan ke atas page blog anda? Silahkan ikuti langkah-langkah berikut:

  • Setelah login ke akun anda, dari halaman dasbor blogger anda klik template-edit HTML.
  • Kopikan kode berikut dan letakkan diatas ]]></b:skin>:

#floating-atas-bawah {
position:fixed; _position:absolute; vertical-align:bottom; width:30px; bottom:5px; right:5px; clip:inherit; z-index:+1000;
}

    Note: Atur ukuran yang berwarna merah sesuai keinginan anda!

  • Setelah itu kopikan kode berikut dan letakkan dibawah ]]></b:skin>

<script src='http://tipstrikblogging.googlecode.com/files/jquery151.js' type='text/javascript'/>
<script src='http://tipstrikblogging.googlecode.com/files/scrolltopdown.js' type='text/javascript'/>

  • Selanjutnya kopi kode HTML berikut dan letakkan dibawah </head>:

<div id='floating-atas-bawah'>
<a href='#header' title='Ke Atas'><img border="0" alt='top' src='https://sites.google.com/site/tipstrikblogging/amatullah/ScrollTop.png'/></a>
<a href='#footer' title='Ke Bawah'><img border="0" alt='down' src='https://sites.google.com/site/tipstrikblogging/amatullah/Scrolldown.pNG�/></a>
</div>

Note:

  • Untuk perintah keatas harus sesuai dengan kode CSS template anda, Untuk kode atas template anda, apakah menggunakan top, head, header atau header-wrapper. Demikian juga perintah kebawah harus sesuai dengan kode bawah pada template anda, apakah footer atau bottom".
  • Jika anda menginginkan alamat tombol atau gambar panah yang lain silahkan ganti alamat gambar dengan tombol gambar-gambar yang anda sukai!

Demikian tutorial Membuat Floating Image Scroll Top And Down Page kali ini. Selamat mencoba dan semoga bermafaat!

Jika ingin membuat floating image atau gambar melayang pada blog silahkan lihat tutorialnya disini



Demikianlah Artikel Membuat Floating Image Scroll Top And Down Page

Sekianlah artikel Membuat Floating Image Scroll Top And Down Page kali ini, mudah-mudahan bisa memberi manfaat untuk anda semua. baiklah, sampai jumpa di postingan artikel lainnya jangan lupa tinggalkan komentar anda dan share yang banyak....heheheh.

Anda sekarang membaca artikel Membuat Floating Image Scroll Top And Down Page dengan alamat link https://trikmitos.blogspot.com/2010/11/membuat-floating-image-scroll-top-and.html
Share on Facebook
Share on Twitter
Share on Google+

Related : Membuat Floating Image Scroll Top And Down Page

0 komentar:

Post a Comment