If you are using a jQuery in JavaScript, you can move the left and right positions of the scroll. See below how you can scroll left and right.
# To scroll left and right in the jquarie, scrollLeft()
The JQuery provides a scroll-related method. The scrollLeft() method can be used as a left-to-right method. Below is a simple grammar.

$(element).scrollLeft(value)

You can enter a value for the value of what pixels to be located relative to the left. If there is no value, the current scroll value will be imported and output. It can also be used to obtain the current left and right scrollbar values.

So let's make a simple example.


! scrollLeft() example
First, try creating an area where you can scroll.
<div class="test" style="width:200px; overflow-x: scroll;">
  <div style="width:1000px;font-size: 20px;">a b c d e f g h i j k l m n o p q r s t u v w x y z</div>
</div>

<button onclick="moveScrollLeft()">Left +100</button>

Now click the button and button below the area made scroll to travel as much as the value of 100.
moveScrollLeft = function() {
  var _scrollX = $('.test').scrollLeft();
  $('.test').scrollLeft(_scrollX + 100);
};



! Example code behavior
Now we're going to actually create and operate the code above. Click the button below to see if the scroll moves.
<div class="test" style="width:200px; overflow-x: scroll;">
<div class="scrolling" style="width:1000px;font-size: 40px;">a b c d e f g h i j k l m n o p q r s t u v w x y z</div>
</div>
<button onclick="moveScrollLeft()">Left +100</button>
<script>
moveScrollLeft = function() {
var _scrollX = $('.test').scrollLeft();
$('.test').scrollLeft(_scrollX + 100);
};</script>

Now click on the button and you'll be moving by 100 to the left.

Let's take a quick look at the example code above. Here's what we're going to find out.

  • Adds overflow-x: scroll to element to create scrollable area
  • Register Click event moveScrollLeft() and make the button call when clicked
  • Gets the current scrollbar position and adds 100 to it

You've learned how to scroll right and left.


! How do I move to the left instead of to the right?
What if you want to move to the left? At this point, you can add a - value, not a + value. For example, if you give the code -100 instead of +100, you're going to move 100 to the left.