Cài đặt phần trăm Trong thanh cuộn
Bằng cách thêm vào tỷ lệ này không chỉ là trang trí ngoài ra giúp blog sẽ có thể nhìn thấy tỷ lệ phần trăm khi di chuyển, nếu nó đã đạt đến dưới cùng của trang sau đó tỷ lệ này sẽ là 100%. Đầu tiên bạn lưu mã sau đoạn
]]></b:skin>
hoặc </style>
dán đoạn code sau thẻ
#scroll {
display:none;
position:fixed;
top:0;
right:15px;
z-index:500;
padding:3px 8px;
background-color:#369fcf;
color:#fff;
border-radius:3px;
font-size:14px;
}
#scroll:after {
content: " ";
position: absolute;
top:50%;
right:-10px;
height:0;
width:0;
margin-top:-6px;
border:6px solid transparent;
border-left-color:#369fcf;
}
</head>
Và đoạn sau
<div id='scroll'></div>
</body>
<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(600);
if (scrollTimer !== null) {
clearTimeout(scrollTimer);
}
scrollTimer = setTimeout(function() {
$('#scroll').fadeOut(600);
}, 1000);
});
//]]>
</script>
Cài đặt phần trăm Trong thanh cuộn
Reviewed by Tin học Cường Tín
on
07:59
Rating:
Không có nhận xét nào: