Element scrollLeft Property - Scroll the contents of a <div> element TO 50 pixels horizontally and 10 pixels vertically: - Javascript DOM

Javascript examples for DOM:Element scrollLeft

  1. HOME
  2. Javascript
  3. DOM
  4. Element scrollLeft

Description

Element scrollLeft Property - Scroll the contents of a <div> element TO 50 pixels horizontally and 10 pixels vertically:

Demo Code

ResultView the demo in separate window 

<!DOCTYPE html>
<html>
<head>
<style>
#myDIV {/*  w w w  .ja  va 2 s . c  om*/
    height: 250px;
    width: 250px;
    overflow: auto;
}

#content {
    height: 800px;
    width: 2000px;
    background-color: coral;
}
</style>
</head>
<body>

<button onclick="myFunction()">Scroll contents of div</button><br><br>

<div id="myDIV">
  <div id="content">
    Some text inside a div element.<br><br>
    Some text inside a div element.
  </div>
</div>

<script>
function myFunction() {
    var elmnt = document.getElementById("myDIV");
    elmnt.scrollLeft = 50;
    elmnt.scrollTop = 10;
}
</script>

</body>
</html>

Related Tutorials