Can't get horizontal Scroll position

Question

I want to get horizontal scroll Position of my div and I can't get why this isn't working.

HTML

<div class='demo'>dsannbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbnbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbb</div>

CSS

.demo {
  overflow-x: auto;
  height: 50px;
}

JS

$(document).ready(function(){
    if($(this).scrollLeft() >= 100){
         alert();   
    }
});

$(document).ready(function(){ var div = $('.demo'); if(div.scrollLeft() >= 100){ alert(); } }); use your div instead of 'this' maybe you can use this as your reference. http://stackoverflow.com/questions/344615/scroll-position-of-div-with-overflow-auto — Reniel Ramos Salvador, Dec 19 '15 at 07:56

score 1 · Accepted Answer · answered Dec 19 '15 at 08:00

1

What you code is doing, is it's getting the value of scrollLeft() when the document is ready (which is 0) and it never changes. You need an event to capture when the scroll of the .demo event is changing. Something like this:

$(document).ready(function(){
  $('.demo').on('scroll', function() {
    var val = $(this).scrollLeft()
    if (val >= 100) alert('Hello')
  })
});

answered Dec 19 '15 at 08:00

ThomasReggi

55,053
85
237
424

No prob, it takes some time getting used to the events. – ThomasReggi Dec 19 '15 at 08:04
Ok, but how would I go if I wanted this function to execute on load? – Alex Nikolsky Dec 19 '15 at 10:37

Can't get horizontal Scroll position

1 Answers1