Cara memasang Tombol Scroll Jquery

Sudah lama tiadak posting lagi,kali ini saya akan berbagi info tentang Tombol scroll ke atas dan bawah dengan Jquery.
cara untuk gulir ke atas atau bawah di situs web/ blog kamu dengan mengeklik tombol navigasi. Ada dua tombol dengan posisi tetap di kiri bawah halaman, masing-masing berfungsi untuk berpindah ke bawah atau ke atas dalam halaman. kedua tombol dilengkapi efek jquery yang akan transparant yang memberikan efek yang bagus dan halus.



pertama,kamu masukan kode css dibawah ini ke template kamu di atas kode ]]>


.nav_up{
padding:7px;
background-color:white;
border:1px solid #CCC;
position:fixed;
background:transparent url(http://www.tympanus.net/scrollupdown/images/arrow_up.png) no-repeat top left;
background-position:50% 50%;
width:20px;
height:20px;
bottom:10px;
opacity:0.7;
left:30px;
white-space:nowrap;
cursor: pointer;
-moz-border-radius: 3px 3px 3px 3px;
-webkit-border-top-left-radius:3px;
-webkit-border-top-right-radius:3px;
-khtml-border-top-left-radius:3px;
-khtml-border-top-right-radius:3px;
filter:progid:DXImageTransform.Microsoft.Alpha(opacity=70);
}
.nav_down{
padding:7px;
background-color:white;
border:1px solid #CCC;
position:fixed;
background:transparent url(http://www.tympanus.net/scrollupdown/images/arrow_down.png) no-repeat top left;
background-position:50% 50%;
width:20px;
height:20px;
bottom:10px;
opacity:0.7;
left:70px;
white-space:nowrap;
cursor: pointer;
-moz-border-radius: 3px 3px 3px 3px;
-webkit-border-top-left-radius:3px;
-webkit-border-top-right-radius:3px;
-khtml-border-top-left-radius:3px;
-khtml-border-top-right-radius:3px;
filter:progid:DXImageTransform.Microsoft.Alpha(opacity=70);
}



lalu masukan juga kode js ini di atas kode





setelah itu,masukan kode hml di bawah ini di template atau di element halaman kamu

Posted in: internet