Jerrys

Ah! Thanks!

A search of greensock.com turns up very little for information on .setTween I get the feeling .setTween is being retired. Can anybody point me to the documentation for .setTween? Thanks in advance!

Now it's working. Sorry. It was really an HTML question. But I was happy to see how you guys work. Thanks!

Still not working. You know I like the way the text looks on Joe's. Does yours look the same?

Thanks Joe. That'll probably work best. Jonathan, yours didn't seem to work in my browser.

Just imagine a door that slides inside a frame that is concealed before you slide it closed. So when it is half done, you only see half the door. I never should have mentioned scaling. I'm just wondering broadly how to do that. I'm pretty sure I could work out the details. Maybe somebody has a clever idea. Can I use z value effectively with gsap to determine which <div>s are on top? Or, in my sliding door example, on bottom?

What's the easiest way to slide a square div into position from the side so that it appears to scale horizontally from 0% to 100%? Do I have to somehow use a mask? Thanks!

How about iPads? I read something recently that made me think that scroll runs into problems in iPads. I even went to amazon to look at the book for velocity.js and around p. 135 they mention scroll and touchpads and say that a full discussion is beyond the scope of the book! Well, it's not as bad as reading font contracts. No forums with guys like Shaun to help a grasshopper out there. Carl, everytime I post, I have to identify mountains or trees.

Thanks Shaun! That'll certainly get me started. Will that work on all the browsers? Do you have a donate button somewhere? I want to send you a six-pack!

Thanks! Let me see! Fingers crossed!

All I want is to use waypoints to trigger an alert when I scroll and get to a div with id=project01. I am using the the non-jQuery version, ie the no frameworks version of waypoints. I will iink to the no frameworks version of waypoints in my HTML with script tags. I will also link to a main.js file. The main.js file at the moment only has that snippet. It does not work. All I need is the entire main.js file that will trigger an alert. Once I have that, I will animate better than Looney Tunes and I will do it all with GSAP. I will be heralded and win many prizes and do GSAP proud.

I'm looking right at it. But I believe you too! Forums are acting stranger and stranger. Here it is again: http://imakewebthings.com/waypoints/

Yes Shaun. I linked to before I introduced the snippet.

No worries. I'll find some other bench to sleep on... But yes, I checked out all those links I'm pretty sure. But I'll check again.

There isn't really much to put in a codepen. Most of it would just be that snippet. I just can't determine whether that is sufficent for a .js file or whether it needs more around it. Safari doesn't like it. But that's all the guy has on his web page. T.S. Elliot said: Only those who will risk going too far can possibly find out how far one can go.

Thanks Shaun, but I just don't have any time for something that has issues. I'm not trying to learn javascript. I don't want to derail the thread with a big debate about speed. The web site you linked to is very nice. But I'd actually like something even faster. Of course that is, as you say, a multi-front battle. I use this a standard: https://www.bahn.com Actually, as my site is much lighter, I'd like it to be even faster than that. I'm just trying to find some easy way of getting high quality scroll script that works with GSAP. I've been pulling my hair for a couple of days now with this other possibility: http://imakewebthings.com/waypoints/ The syntax that figures so prominently on the page looks nothing like what figures in the few videos online. I have a js file that has only these lines that I get from what we see on the website: var waypoint = new Waypoint({ element: document.getElementById('project01'), handler: function() { notify('Context example triggered') }, }) I link to it along with the noframework.waypoints.js in my HTML. But Safari throws up the error: No element option passed to Waypoint constructor. I'm at my wits end. I actually know a fair bit about animation having used After Effects extensively. But this inability to get a solid scroll bar script has stopped me dead. Frankly, I'm rather shocked that GSAP can be so extensive and not have its own plugin for this. I would have thought that scroll triggering would be absolutely central to web animation. If can't use GSAP, then I'll just opt for animate.css + the WOW plugin. But I'd like to have the functionality of GSAP to EXPERIMENT with WITHOUT taking on JQUERY.

To be honest, my animations are probably going to be REALLY simple. Just a small 10% translation to emphasize an arrow that links to another page. I just need them to trigger once when the user scrolls down to the arrow. I never wanted to use any javascript. But then I found that html and css can't tell me when the user has scrolled to some point. But now it seems like I need to take on board jQuery. Could I somehow use velocity? I'd really like to keep things ultra fast. I'm a musician and the web seems really slow to me. Every 10ms delay is noticeable to me.

Thanks so much for the reply. In the ScrollMagic 101 video number 1 on youtube ( at 5.25), they begin their main.js file with $(document).ready.(function(){.... I take it that is a jQuery statement. What would I use to do it without jQuery? Thanks again!

I'm having no success trying to get any simple animation to trigger when it gets reached on a web page. Here are some related questions: 1) Am I right in thinking that neither CSS, nor basic javascript, nor GSAP has an actual scroll trigger? 2) So, do I then need something like ScrollMagic? Is that the best? 3) But it also seems I need jQuery to make ScrollMagic work. Is that correct? 4) But if I need jQuery for ScrollMagic and ScrollMagic for GSAP, then I don't understand how anything gets me scrolling is going to be lightweight. 5) How do most GSAP folks accomplish scroll triggering? Thanks!