html页面刷新回到顶部_html页面滚动到一定位置显示回到顶部按钮

.t-right-bar {

position: fixed;

right: 0;

bottom: 10%;

width: 48px;

height: 48px;

z-index: 1000;

cursor: pointer;

}

.t-right-bar > div {

float: left;

height: 36px;

margin-bottom: 1px;

border-radius: 20px 0 0 20px;

color: #fff;

padding-left: 100%;

clear: both;

white-space: nowrap;

font-size: 13px;

line-height: 36px;

font-style: normal;

background-color: #aaa;

background-repeat: no-repeat;

background-position: 12px center;

transition: transform .2s cubic-bezier(.215, .61, .355, 1), padding .2s cubic-bezier(.215, .61, .355, 1), margin .2s cubic-bezier(.215, .61, .355, 1), background-color .2s cubic-bezier(.215, .61, .355, 1)

}

.t-right-bar > div.active, .t-right-bar > div:hover {

transform: translateX(-100%);

padding-left: 45px;

padding-right: 10px;

margin-left: 48px;

background-color: #23a0e1;

text-decoration: none;

color: #fff

}

.t-right-bar .t-bar-support {

background-image: url(../img/icon/support_1.svg); //按钮图标

background-position: 14px center;

}

.t-right-bar .t-bar-rocket {

background-image: url(../img/icon/rocket_1.svg); //按钮图标

background-position: 19px center;

}

.t-bar-support a{

color: white;

}

.t-bar-support a:hover{

color: #fff

}

$(".t-right-bar").hide();

$(function () {

$(window).scroll(function () {

if ($(window).scrollTop() > 100) {

$(".t-right-bar").fadeIn(500);

}

else {

$(".t-right-bar").fadeOut(500);

}

});

$("#back-to-top").click(function () {

$('body,html').animate({scrollTop: 0}, 100);

return false;

});

});