自動スクロールのHTML,CSS,JavaScriptです。ページのソースに下記を入れて下さい。

<head>
<style>
<!--
div.btn-box{
position: fixed;
top: 30px;
right: 30px;
} ul{
list-style:none;
}
.btn{
display: inline-block;
margin: 1px;
font-size: inherit;
line-height: 1.5;
padding:0.25em 0.5em;
font-weight: normal;
border:1px solid;
border-radius: 0.2em;
cursor: pointer;
font-family: "Avenir Next", Avenir, sans-serif;
}
.btn{
background-color: rgba(255,255,255,0.5);
color: #000;
border-color: #000;
}
.btn:hover{
background-color: rgba(255,217,217,0.5);
color: #cc0000;
}
-->
</style>
<script>
var myTimer;
function autoScroll(s) {
window.clearInterval(myTimer);
if(s !== 0) {
myTimer = window.setInterval(function() {
var before = document.documentElement.scrollTop || document.body.scrollTop;
window.scrollBy(0, s);
var after = document.documentElement.scrollTop || document.body.scrollTop;
if(before === after) {
window.clearInterval(myTimer);
}
}, 30); //スクロールのスピード(数値が大きいほど遅くなる)
}
}
</script>
</head>
<body>
<div class="btn-box">
<ul>
<li><button class="btn" onclick="autoScroll(-1);" title="up">▲</button>
<li><button class="btn" onclick="autoScroll(0);" title="stop">■</button>
<li><button class="btn" onclick="autoScroll(1);" title="down">▼</button>
</ul>
</div>
<p>~ページの内容~</p>
</body>
<!-- autoScroll();の数値はスクロールのなめらかさ(小さいほどなめらかに、マイナスは反対方向へ) -->

ウィンドウを閉じる