GSAP infinite gallery – How to control each images i have in a const imgURLArray via CSS

[CAT is CAT]

0

I would like to control each image I have in my const imgURLArray, if possible via class or id.

If this is only possible via JS, could someone help me or teach me how to do it?

I have created a CodePen to see the infinite gallery in action.
 

For example I would like to control img1  via .class on hover 
 each image does have a .sliderImage class I could use. I don't have any other more specific value I can grab.
This means that I would have to add something like an id if you needed a specific image,

Can somebody help me with this?

 

 

const imgURLArray = [
    "url(img1)",
    "url(img2)",
    "url(img3)",
    "url(img4)",
  ];

 

See the Pen rNvdrNb by cat999 (@cat999) on CodePen

[GreenSock]

I'm not sure what you mean by "control each image". Did you have a GSAP-specific question? We're happy to help with those, but we don't have the bandwidth to provide free general consulting services to read through 350+ lines of code and figure out custom logic solutions (please read the forum guidelines). You're welcome to post in the "Jobs & Freelance" section if you'd like to hire someone to help. 

 

I'd also recommend updating the GSAP version - that demo you provided uses a pretty old version. We're now on 3.11.3. Good luck!