Search code examples
javascriptjqueryjquery-pluginsscrolltojquery-scrollable

Get axis-x position inside scrollable div


I have a scrollable div which overflow is hidden. I am using this plug-in to scroll the div. How can I detect the axis x position with jquery (or maybe with this plug-in) so if there is nothing to scroll on left, I would be able to hide the left arrow, and show it again when the axis has moved?


Solution

  • Look at the scrollLeft property.

    It can be accessed like an attribute in jQuery.

    var scrollLeft = $('element').attr('scrollLeft');
    

    jsFiddle.

    To determine if the user has scrolled all the way to the left, check for (scrollLeft == 0).

    To see if they have scrolled all the way to the right, you should be able to do (scrollLeft == element.attr('scrollWidth') - element.width()).