Hướng dẫn thêm nút Back To TOP hiệu ứng đẹp cho Blogspot ••• Xem bình luận Thứ Hai, 22 tháng 1, 2018

Để làm được hiệu ứng này bạn thêm đoạn js sau trước thẻ </body> :

<script type='text/javascript'>
    $('#bacsiwindows-go-top').on('click', function (e) {
        e.preventDefault();
        $('html,body').animate({
            scrollTop: 0
        }, 999);
    });
</script>

Thêm Đoạn CSS này trước thẻ ]]></b:skin> :

#bacsiwindows-go-top{position:absolute;top:-35px;right:50%;background:#333;color:#7577a9;border:6px solid #dddddd;height:60px;width:60px;text-align:center;line-height:60px;border-radius:0;font-size:1.2em;z-index:69;transform:rotate(45deg);margin:0 -50px}
#bacsiwindows-go-top:hover{border-radius:0 50px 50px;color:#7577a9!important}
#bacsiwindows-go-top i{transform:rotate(-45deg)}

Chèn đoạn code này vào nơi muốn hiển thị ( mình thì đặt dưới thẻ <div id='lower'> ) :

<a href='javascript:;' id='bacsiwindows-go-top'><i class='fa fa-chevron-up'></i></a>

*Nguồn : BacSiWindows 

Thích

6 bình luận

Hashtag: #Thủ Thuật Blogspot

Bạn và người khác