kayee

I have a horizontal gallery that is positioned centered on the page. I have a left and right button which slide the gallery left and right using TweenMax timeline on mouse hover. The right button is hidden on page load and I want to show the right button once the gallery reaches a certain offset position. If I use Jquery scroll I can detect the changing offset position of the gallery but if the user hovers on the button I can't get the changing offset position of the gallery while the gallery is tweening. How can I get the moving offset position of the gallery during mouse hover?

Oh, thanks and really sorry! I just had a rubber ducking moment. I just realised that's what I needed to do right before you commented. Thank you.

Oh wait a moment.. a duh.. maybe I just need to move the gallery as the total length.

Hi, Thank for the reply. Apologies for being unclear. What I should've said is this long div is actually a gallery containing a set of list items which are thumbnails. On left button hover the horizontal gallery will slide left non-stop until you reach the end of the ul. I also have a right button to scroll right but I didn't put it in my codepen example. My problem is when you hover on the left button the gallery ul will only slide '-=200px' once. Here is a new codepen. - http://codepen.io/anon/pen/zqEGeg The setInterval codepen example from my first comment is super close to what I want to achieve. But the gallery ul doesn't stop animating instantly when you stop hovering on the button.

I have a timeline which moves the x position of a really long div to the left. When you hover over a button it will trigger the timeline. However, I can't seem to get the timeline to move continuously. I've tried setting a repeat and an onComplete function to loop the timeline but neither of them worked. I did manage to move the long div using setInterval but when you mouse leave the button the tween animation doesn't stop instantly. Here is a codepen of the setInterval example - http://codepen.io/anon/pen/GZvLVp and here is a codepen of the timeline example - http://codepen.io/anon/pen/BKdeBQ I guess ideally I would want to use a timeline so I can pause the animation on button mouseleave right?