Webflow Animation Tips and Tricks

all right guys wow this has been

a wild ride of crazy animations

and interactions and hopefully the more

you practice

the more you start familiarizing

yourself with some of these concepts

you'll start to gain that experience

that you need to apply

to those challenging projects that might

come your way

very simple javascript can enable you to

go a little bit further so for example

i added was that when i click on each of

these cards it takes me to one of the

slides

in our slideshow component and right now

currently

webflow does not enable us to do that i

cannot just simply select one of these

and then

take you to the slide i have to use

javascript for that a very simple script

that enables you to slide from one page

to another

just calling for an id what trigger we

want and it's of course

on click we want a specific button to do

something right now what i've done is

i've created this little script that

says

if you find the card that has this id

in the dom of the html document when you

click on that

i want you to find the slideshow find

the slideshow pagination

which is in this case this little

paginator and then take me to the second

one

every element that i have in here for

example these card triggers have an

id called go to movies so remember this

is a singular id

just by simply using a little bit of

javascript i can tell

the document to do a specific action

all right another nice example that i

could not do modify was these little

squares i wanted to kind of turn them

around

and rotate them to make like a little

rumble

and you can do that by adding some

custom styling

into your document so if you go into

your documents home

you can start adding some of those

transformations

like the transform the dot in the slider

which is that's the class that webflow

is giving to that slider

and just rotate it 445 degrees that's it

it creates this really simple design in

our slider

in our pagination i've gone ahead and

i've created an alternative version of

that same site

and i've added a little bit of

javascript to make the

the trigger of your scroll so as you

scroll through

you have this video playing in the

background

by adding some script we can start

adding and making this

incredibly powerful alright hopefully

you guys enjoyed that

so let's go and jump into content

management system

utilizing webflow

‍