jQuery Scroll down page a set increment in pixels on click

Question

I m trying to make a page scroll down 150px from the current position when an element is clicked   So lets say you re roughly halfway scrolled down a page   You click this link  and it will slide you down an additional 150 pixels   Is this possible with jQuery   I ve been looking at scrollTop and the scrollTo plugin  but I can t seem to connect the dots

User · Answer

You might be after something that the scrollTo plugin from Ariel Flesler does really well   http   demos flesler com jquery scrollTo

User · Answer

You can do that using animate like in the following link   http   blog freelancer-id com index php 2009 03 26 scroll-window-smoothly-in-jquery  If you want to do it using scrollTo plugin  then take a look the following   How to scroll the window using JQuery   scrollTo   function

User · Answer

var y     window  scrollTop       your current y position on the page   window  scrollTop y 150

User · Answer

Just check this     document  ready function             scroll   click function event              html  body   animate  scrollTop     150px    800                 It will make scroller scroll from current position when your element is clicked  And 150px is used to scroll for 150px downwards

User · Answer

Updated version of HCD s solution which avoids conflict   var y    j window  scrollTop      j  html  body   animate   scrollTop  y    j window  height      600

User · Answer

Pure js solution for newcomers or anyone else   var scrollAmount   150  var element   document getElementById  elem     element addEventListener  click   scrollPage    function scrollPage         var currentPositionOfPage   window scrollY      window scrollTo 0  currentPositionOfPage   scrollAmount

[jquery] jQuery: Scroll down page a set increment (in pixels) on click?

Examples related to jquery