Đăng nhập Blogger ~> Vào Mẫu ~> Chỉnh sửa HTML
Thêm đoạn css này bên trên thẻ đóng
Tiếp theo, thêm code này sau thẻ
Cuối cùng, thêm đoạn code này trước thẻ
Thêm đoạn css này bên trên thẻ đóng
]]></b:skin>
#scroll { display: none; position: fixed; top: 0; right: 20px; z-index: 500; padding: 3px 8px; background-color: #2187e7; color: #fff; border-radius: 3px; } #scroll:after { content: " "; position: absolute; top: 50%; right: -8px; height: 0; width: 0; margin-top: -4px; border: 4px solid transparent; border-left-color: #2187e7; }
Tiếp theo, thêm code này sau thẻ
</head>
<div id='scroll'/>
Cuối cùng, thêm đoạn code này trước thẻ
</body>
rồi Lưu Mẫu lại.<script type='text/javascript'> //<![CDATA[ var scrollTimer = null; $(window).scroll(function() { var viewportHeight = $(this).height(), scrollbarHeight = viewportHeight / $(document).height() * viewportHeight, progress = $(this).scrollTop() / ($(document).height() - viewportHeight), distance = progress * (viewportHeight - scrollbarHeight) + scrollbarHeight / 2 - $('#scroll').height() / 2; $('#scroll') .css('top', distance) .text(' (' + Math.round(progress * 100) + '%)') .fadeIn(100); if (scrollTimer !== null) { clearTimeout(scrollTimer); } scrollTimer = setTimeout(function() { $('#scroll').fadeOut(); }, 1500); }); //]]> </script>
Nhận xét
Đăng nhận xét