Jump to content

Search In
  • More options...
Find results that contain...
Find results in...
Sign in to follow this  

Back with Gradient : Changing offset value

Recommended Posts

Hello everybody ! 


How are you there ? 

Since my last post here, I improved a lot of things and I changed color of my illustration (not yet in function of the local time, but it's coming ! ), thank's to Diaco.AW   ;)

Here is the codepen attached to this topic : 

See the Pen VLpLmW%C2%A0 by BibiCoding (@BibiCoding) on CodePen


But today I'm here because I have an initial gradient with 13 children "stop", but then in the other gradient, I would like to have only 7 colors in the gradient. That's why I decided to include Jquery to select children, then to make a table for new colors that I want ( couleurCiel[] ). 


I've done a loop with the var "c" which represent a child of the gradient (incremented at the end of the loop with "c++" and the var "i" to watch the associated table. There's an other table "offset[]" with value of the new gradient offset i would like to have. But you'll see in the codepen that without changing the offset, it only change the color of the "Defaults" gradient but not it's offset, so that there is a huge black gap on the top ! 

The question is : How i could change the gradient offset and include this in my loop ? And is my code well written ? The staggerFromTo is a good solution in my case ? 

Moreover, you'll see that the animation is not really fancy, it goes one color after an other and it would be wonderfull if each children could changes at the same time (overlapping tweens ?

Thanks a lot and have a nice sunny day ( I hope for you :D  )

See the Pen VLpLmW by BibiCoding (@BibiCoding) on CodePen

Link to post
Share on other sites

Thanks Diaco.AW  ! 

This is working well thanks, but can I include this attr:{} in StaggerFromTo method which is mine ? 

Link to post
Share on other sites

Sorry Diaco.AW I don't want to create an other post because I've got nearly the same problem now... 

I tried as far as I could to get it work but I'm not able to set the OffsetMorning (named "OffsetCielMatin") on the animation's start... It seems that colors changing is good, but on the begining of the animation there are Morning's colors but not the appropriate offset ! As a matter of fact, it's only the MidDayOffset which is applied (named "OffsetCielMidi")

Check this out here

See the Pen VLpLmW?editors=101 by BibiCoding (@BibiCoding) on CodePen

It's the hardest part of my project, but it seems to be a good training...


Link to post
Share on other sites

Thanks a lot Diaco.AW 

I hope that i'll not get other problems with this illustration ! Have a nice day  :-P 

Link to post
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
Sign in to follow this  

  • Recently Browsing   0 members

    No registered users viewing this page.