showing results for - "page up down control buttons javascript"
Lucas
24 Oct 2018
1<!DOCTYPE html>
2<html>
3<head>
4    <title>Scroll Up and Down from buttons </title>
5    <script type="text/javascript">
6        var scrollHandler;
7        function btnup_mousedown() {
8            scrollHandler = window.setInterval(scrollUP, 100);
9        }
10 
11        function btndown_mousedown() {
12            scrollHandler = window.setInterval(scrollDown, 100);
13        }
14 
15        function scrollUP() {
16            var position = document.getElementById('divimg').scrollTop;
17            document.getElementById('divimg').scrollTop = position - 50;
18        }
19 
20        function scrollDown() {
21            var position = document.getElementById('divimg').scrollTop;
22            document.getElementById('divimg').scrollTop = position + 50;
23        }
24 
25        function onmouseup() {
26            window.clearInterval(scrollHandler);
27        }
28    </script>
29 
30</head>
31<body>
32    <div style="width: 400px">
33        <div id="divimg" style="height: 568px; overflow: auto;
34                                float: left; width: 80%;">
35            <img class="page-image" src="9.png">
36        </div>
37        <div id="divbuttons" tyle="height: 568px;float: left;width: 80%;">
38            <input id="btnup" type="button" value="Up" 
39                    onmousedown="btnup_mousedown();" onmouseup="onmouseup();" />
40            <input id="btndown" type="button" value="down" 
41                   onmousedown="btndown_mousedown();" onmouseup="onmouseup();" />
42        </div>
43    </div>
44</body>
45</html>