Kamis, 15 Maret 2012

Cara Membuat Tombol Back To Top Melayang (Home, Bottom, dan Refresh)

  • Masuk ke Tata Letak -> Edit HTML lalu


  • Copy CSS berikut dan pastekan di atas ]]></b:skin>



    #mangetsu {
    position:fixed;_position:absolute;bottom:0px; right:0px;
    clip:inherit;
    _top:expression(document.documentElement.scrollTop+
    document.documentElement.clientHeight-this.clientHeight); _left:expression(document.documentElement.scrollLeft+ document.documentElement.clientWidth - offsetWidth); }
    #mangetsu a
    {
    filter:alpha(opacity=65);
    -moz-opacity:0.65;
    opacity:0.65;
    border:0;
    }
    #mangetsu img
    {
    border:0;
    }
    #mangetsu a:hover
    {
    filter:alpha(opacity=100);
    -moz-opacity:1;
    opacity:1;
    }
  • Kode yang dicetak tebal adalah letak dari widget, "bottom" bisa kamu ganti dengan "top" dan "right" bisa kamu ganti dengan "left" (terserah kamu)Kalau sudah, cari lagi kode </body> tambahkan kode <a name='ngisor-dhewe'></a> tepat diatasnya.
  • Simpan templatenya!
    Sekarang tinggal memasang shortcutnya...
    Copy kode yang ada dibawah ini!

  • <div id='mangetsu'>
    <table border='0'>
    <tr>
    <td><a expr:href='data:blog.homepageUrl' title='Home'><img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg0lZKyS7FDZmxg6uEiD1OC9E4lccENANTMeZrG-Z6_UGsFc2v-t2S9p2aku55k7VCjTGKHUf0DYTJrY8j_T1S-9vcjmvf__NoFF3ZdcJwUQhX307QZ1EjXOzgT0ekVo8hXA9lga1QBXdw/s320/home-icon2.png'/></a></td>
    <td><a href='#' title='back to top'><img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj22OK7HuQ99ZuHTh4D37amrspW46hQ49joTjiDVPWTljzEuR5S9bfZff3ysTLNpC9q-Rxp8q5HKHuSpAYO24SQPe75nzI-fFFMMfGZ2sgUnr2s-b1HOFdgzDIxvFdtuFlrnlENC3UEZBs/s320/pre-icon1.png'/></a></td>
    <td><a href='#ngisor-dhewe' title='back to bottom'><img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgPXNu2L5qh3u03uU_cWfwizqs3mjLBpYvRRRbg8dWLltMat9HRxmmg9_jMBmhBU2cvWz607LvPWYTjvcoQXy6kUwB0u0qRuzf2NlW5u_GF5Mr1_D6hR9MsUmQ5NB9yv7zBKUsHVgwzrHs/s320/next-icon2.png'/></a></td>
    <td><a href='#' onClick='window.location.reload()' title='Reload page'><img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhU04lqEtBP1gxUsXTMh9CccLETIKeyQriJvihY1W6goIx4GSAvhkNN6c2Tl5bkV1B4Sl8LX8tY73wIOZQlDFrvkEKXBL_rKjkrA0WpNLG1S5_G-dvBKHj5KKHGzgzhVQ8mk-92ZVOg2pU/s320/refresh-icon1.png'/></a></td>
    </tr>
    </table>
    </div>

    Kodenya bisa paste dibawah <body> atau bisa juga ke Tata Letak -> Elemen Halaman -> Tambah Gadget -> HTML/Javascript, Paste dan simpan.

    Pasang Logo Page Feel HTC ( Layar Menggulung Pada Blog Anda, Tidak Berat Saya Yang Jamin Namun Mempercantik Blog ini Juga Memperkuat Rasa Persatuan Dan Persahabatan Antar Bloggers )

    Pasang Kodenya Di Bawah ini di atas kode </head> :

    <SCRIPT type='text/javascript'>var tujuan ='http://ojelhtc.blogspot.com/'</SCRIPT><SCRIPT src='http://ojel88.googlecode.com/files/fellhtc.js' type='text/javascript'></SCRIPT>

    Terima Kasih Jika Anda Telah Memasang Logo ini Silakan Konfirmasikan Ke Blog ini
Loading...
arifinzyt. Diberdayakan oleh Blogger.

Translate