Để thêm tiện ích này trong blog của bạn, trước tiên đi vào Blog Tiêu đề → Giao diện → Thêm Widget → HTML / JavaScript. Thêm mã dưới đây.
<style type='text/css'>
#gotop{cursor:pointer;width:30px;height:30px;position:fixed !important;position:absolute;z-index:999;text-indent:-9999px;border:1px solid #144F69;background-color:#067BAF;background-image:-webkit-radial-gradient(ellipse at center top,#2493C4,#086A95);background-image:-moz-radial-gradient(ellipse at center top,#2493C4,#086A95);background-image:-ms-radial-gradient(ellipse at center top,#2493C4,#086A95);background-image:-o-radial-gradient(ellipse at center top,#2493C4,#086A95);background-image:radial-gradient(ellipse at center top,#2493C4,#086A95);-webkit-box-shadow:inset 0 0 0 1px #2493C4,0 1px 3px black;-moz-box-shadow:inset 0 0 0 1px #2493C4,0 1px 3px black;box-shadow:inset 0 0 0 1px #2493C4,0 1px 3px black;-webkit-border-radius:10px 0 0 0;-moz-border-radius:10px 0 0 0;border-radius:10px 0 0 0;overflow:hidden}
#gotop:after{content:"";display:block;width:0;height:0;border-width:10px 4px;border-style:solid;border-color:transparent transparent #C3D1D7 transparent;position:absolute;top:0;left:11px}
#gotop:focus{outline:none}
#gotop:hover:after{border-bottom-color:white}
#gotop:active{background-image:-webkit-linear-gradient(#144F69,#2493C4);background-image:-moz-linear-gradient(#144F69,#2493C4);background-image:-ms-linear-gradient(#144F69,#2493C4);background-image:-o-linear-gradient(#144F69,#2493C4);background-image:linear-gradient(#144F69,#2493C4)}
</style>
<a id='gotop' style='bottom: -50px; right: -50px;'>Lên Trên!</a>
<script type='text/javascript'>
//<![CDATA[
$(window).scroll(function(){if($(this).scrollTop()>100){$("#gotop").removeAttr("href");$("#gotop").stop().animate({bottom:"0",right:"0"},{duration:800,queue:false})}else{$("#gotop").stop().animate({bottom:"-50",right:"-50"},{duration:1000,queue:false})}});$(function(){$("#gotop").click(function(){$("html, body").animate({scrollTop:0},"slow");return false})});
//]]>
</script>
Chúc bạn thành công.
Không có nhận xét nào:
Đăng nhận xét