Streaming live at 10am (PST)

Repeating Background Motion


#1

Have a background image that I want to make have the appearance of going in a wave (slowly up and down and moving to right. Then loop continuously. How would this best be accomplished in WF?


#2

Pick that element where is your image.
Create an interaction with LOAD trigger and loop it.


#3

I don't see how that is going to work without an interaction built. And when I use a background and want it to move then white space shows.


#4

Well, then probably it is SVG animation or some jQuery plugin. Sorry, I am not specialist in that.


#5

I was thinking of going the SVG route but I didn't get it smooth so, I'll keep learning.


#6

Hey @jdesign do you have an example of what you're referring to? I can do my best to help you figure it out smiley

Thanks,

Waldo smile


#7

You cannot control the background with an wf interaction.

You have to use jquery for that.


#8

@Waldo_Broodryk I'm trying to use essentially the same background images (offset from each other) in two divs and have one move to create a scrolling left to right effect. On zurb.com/manifesto there is a blue section that has the effect I'm trying to achieve.


#9

http://codepen.io/Scarbrough9/pen/XbZQZr uses a continuous looping scroll background.

What you are showing in the zurb.com example is using scroll hijacking - much more complex.


#10

@vlogic Yes, that's really it but I need it to scroll horizontally.


#11

This topic was automatically closed 60 days after the last reply. New replies are no longer allowed.