Link to home
Start Free TrialLog in
Avatar of Adam
AdamFlag for Canada

asked on

Small animation issue with jQuery plugin Scrollorama

Hi there,

I've been playing around with the jQuery plugin Scrollorama to add some scrolling animations to my site. In the plugin documentation, unless specified otherwise, most of the animations are triggered once a user is scrolling and the animated item first appears at the bottom of a user's browser (the animation then continues the more you scroll).

However, no matter what I do, all of my animations seem to occur only once the item reaches the top of my browser (which kind of defeats the purpose as you only partially see the animation).

I've set up a quick demo to show what I mean—you can check it out here (the title of Section 2 should begin to move up into its original position as soon as you see it as you are scrolling but it's only doing so once it reaches the top of your screen).

I have no idea why it would be doing this. I know a quick fix would be to add a negative delay but I know by default, it should not be doing what it's doing so I would rather get a better understanding of what I've done wrong. I'm sure there's a simple explanation for it but I've been wracking my brain over it and could use some help. Thanks in advance!
Avatar of COBOLdinosaur
COBOLdinosaur
Flag of Canada image

To start with you need to correct the error.  <div class "section1" is missing the equal sign.

Cd&
Avatar of Adam

ASKER

Thanks @COBOLdinosaur. This was just a quick example I whipped up to demo the issue. In any case, I've corrected the error. But obviously, that's not really the source of the problem...
Well it will come down to pluging in the right values to the script.  I think probably the delay and start properties are the ones to play with.  I don't see anything indicating a support link on the scrollarama site, so like most free jquery stuff you get what you pay for.

Cd&
Avatar of Adam

ASKER

Thanks @COBOLdinosaur. I realize its possible that it has to do with the properties that I set. I went back and forth between the demo from the plugin and my own site and even having all the same settings, I was experiencing the same issue. So I'm not sure if I'm just overlooking something and was hoping someone could help me troubleshoot the issue.

The fact that its a free plugin really shouldn't have anything to do with my problem. Its a very widely used and popular plugin. Unfortunately, I haven't found anyone who has experienced my same issue so its quite possible that I'm the one doing something wrong. I just wanted another set of eyes to take a look at my code and give me a hand.
ASKER CERTIFIED SOLUTION
Avatar of AccurateDesign
AccurateDesign

Link to home
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
Start Free Trial
The fact that its a free plugin really shouldn't have anything to do with my problem.

The generally accepted metric is that 80% of the free plugins contain bugs; more than half can have compatibility and conflict issues with other plugins, and around 5% contain malware.

The fact that there is no support link means that getting support becomes a matter of luck finding someone famliar with the specific plugin you are using among the tens of thousands available.  In this case it looks like you are in luck because AccurateDesign appears to know the product.

Cd&