Jump to content
GreenSock

Search In
  • More options...
Find results that contain...
Find results in...
prabhath

How to add dynamic animated sliders

Recommended Posts

Hi

I heave animated banners template list create using timelinelite.

I want to select some banners as preview and edit text then add to timelinelite

after that play all selected banners

how can i do that. please help

Thank you

 

 

preview.jpg

Link to comment
Share on other sites

Welcome to the forums, @prabhath. I read your question a few times and I don't understand what you're asking. Do you have a GSAP-specific question we can help with? 

Link to comment
Share on other sites

sorry for my English,

I have 5 slides animated using timelinelite.

I want to those all animated slides combined tougher .

Ex.

I want to play slide one after slide 3 like that. 

 

let tm1 = new timelinelite();

let tm2 = new timelinelite();

let tm3 = new timelinelite();

 

let tmArr = [tm1,tm2,tm3 ]

 

how can I play this array.

please help

 

 

Link to comment
Share on other sites

Just add your array to another timeline.

 

var mainTimeline = new TimelineMax({ repeat: -1 })
  .add(tmArr)

 

If you need more help, please provide a simple demo.

 

 

 

  • Like 2
Link to comment
Share on other sites

First, you are missing some necessary files. It's usually better to just load TweenMax as it contains everything you need.

https://cdnjs.cloudflare.com/ajax/libs/gsap/2.1.3/TweenMax.min.js

 

I'm not exactly sure what you're trying to do here. Maybe something like this?

 

See the Pen ZdBdvN by osublake (@osublake) on CodePen

 

 

  • Like 1
Link to comment
Share on other sites

yes it is thank you. 

and 1 thing, how can I animate last to fist slide?

Thank you again for your help

Link to comment
Share on other sites

7 minutes ago, prabhath said:

and 1 thing, how can I animate last to fist slide?

 

Isn't already doing that? The first slide starts out with an opacity of 0 and then animates to an opacity of 1. So at the end of slide 5, everything gets reset to an opacity of 0.

 

If you want to replay the timeline from a different starting point, you can use a technique like this.

 

 

 

And if you trying to create dynamic animations, this is a really good article.

https://css-tricks.com/writing-smarter-animation-code/

 

 

  • Like 3
Link to comment
Share on other sites

13 hours ago, prabhath said:

This is I trying to tell you

please refer link

https://jsfiddle.net/prabhath/3xjsqde1/15/

 

you see last slide and first slide not overlapping. :(

 

 

Please don't ask something else by editing your original comment. We don't get notifications for that. Just create a new response.

 

Here's something similar to what Mikel showed. You will need to fix the layering though. Slide 1 will always be underneath slide 5.

 

See the Pen KjaxMj by osublake (@osublake) on CodePen

 

 

  • Like 3
Link to comment
Share on other sites

13 hours ago, mikel said:

Hi @prabhath,

 

Maybe this concept is suitable for you ...

 

 

 

 

Happy tweening ...

Mikel

Hi Mikel,

Thank you very much, This is grate..

 

Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
  • Recently Browsing   0 members

    • No registered users viewing this page.
×