Tạo nút trượt lên đầu trang mượt mà với jquery.min

(DEMO)

Thêm code sau vào trước thẻ </head>

Mã 1

<script src='http://menulan.googlecode.com/files/jquery.min.js' type='text/javascript'/>

 Mã 2

<style type='text/css'>

#w2btoTop {display:none;text-decoration:none;position:fixed; bottom:10px; right:7px; overflow:hidden; width:51px; height:51px; border:none;text-indent:-999px;background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhdC8d8YFxS1QdWKHmDinMxxU4tm0EWDx5irsvW6M31h_OBGeg4XusyUQfs-v7NtSuIxaq4P11AUKcncJrb9GMOM6jlZvYwCK97ehQJ2nUU5jTKuwNgTftM4kSwZOY92Kge4ws3YCCkKtQ/s128/backup.jpg)no-repeat left top;}

#w2btoTopHover {background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhdC8d8YFxS1QdWKHmDinMxxU4tm0EWDx5irsvW6M31h_OBGeg4XusyUQfs-v7NtSuIxaq4P11AUKcncJrb9GMOM6jlZvYwCK97ehQJ2nUU5jTKuwNgTftM4kSwZOY92Kge4ws3YCCkKtQ/s128/backup.jpg)no-repeat left -51px;width:51px;height:51px;display:block;overflow:hidden;float:left;opacity: 0;-moz-opacity: 0;filter:alpha(opacity=0);}

#w2btoTop:active, #w2btoTop:focus {outline:none;}

</style>

<script src='http://phaijsblogduong.googlecode.com/files/w2b_jquery.ui.totop.js' type='text/javascript'/>

<script type='text/javascript'>

$(document).ready(function(){ $().UItoTop({ easingType: &#39;easeOutCubic&#39; }); });

</script>

Chú ý: các đoạn code màu đỏ:

1. <script src='http://menulan.googlecode.com/files/jquery.min.js' type='text/javascript'/> nếu mã này đã thực hiện rồi thì bỏ qua, chỉ thực hiện mã 2 không sẽ ảnh hưởng đến hình ảnh trượt JQuery

2. http://phaijsblogduong.googlecode.com/files/w2b_jquery.ui.totop.js lưu lại và tải lên host riêng của bạn để sử dụng lâu dài.