page up down control buttons javascript code example

Example: page up down control buttons javascript

<!DOCTYPE html>
<html>
<head>
    <title>Scroll Up and Down from buttons </title>
    <script type="text/javascript">
        var scrollHandler;
        function btnup_mousedown() {
            scrollHandler = window.setInterval(scrollUP, 100);
        }
 
        function btndown_mousedown() {
            scrollHandler = window.setInterval(scrollDown, 100);
        }
 
        function scrollUP() {
            var position = document.getElementById('divimg').scrollTop;
            document.getElementById('divimg').scrollTop = position - 50;
        }
 
        function scrollDown() {
            var position = document.getElementById('divimg').scrollTop;
            document.getElementById('divimg').scrollTop = position + 50;
        }
 
        function onmouseup() {
            window.clearInterval(scrollHandler);
        }
    </script>
 
</head>
<body>
    <div style="width: 400px">
        <div id="divimg" style="height: 568px; overflow: auto;
                                float: left; width: 80%;">
            <img class="page-image" src="9.png">
        </div>
        <div id="divbuttons" tyle="height: 568px;float: left;width: 80%;">
            <input id="btnup" type="button" value="Up" 
                    onmousedown="btnup_mousedown();" onmouseup="onmouseup();" />
            <input id="btndown" type="button" value="down" 
                   onmousedown="btndown_mousedown();" onmouseup="onmouseup();" />
        </div>
    </div>
</body>
</html>

Tags:

Javascript Example

Recent Posts