//これで動かなければ追記
#pageTop {
position: fixed;
bottom: 20px;
right: 20px;
}
#pageTop a {
display: block;
z-index: 999;
padding: 8px 0 0 8px;
border-radius: 30px;
width: 35px;
height: 35px;
background-color: #9FD6D2;
color: #fff;
font-weight: bold;
text-decoration: none;
text-align: center;
}
#pageTop a:hover {
text-decoration: none;
opacity: 0.7;
}
//■page topボタン
$(function(){
var topBtn=$('#pageTop');
topBtn.hide();
//◇ボタンの表示設定
$(window).scroll(function(){
if($(this).scrollTop()>80){
//---- 画面を80pxスクロールしたら、ボタンを表示する
topBtn.fadeIn();
}else{
//---- 画面が80pxより上なら、ボタンを表示しない
topBtn.fadeOut();
}
});
// ◇ボタンをクリックしたら、スクロールして上に戻る
topBtn.click(function(){
$('body,html').animate({
scrollTop: 0},500);
return false;
});
});
<p id="pageTop"><a href="#">page top</a></p>