Search the Community
Showing results for tags 'blur decimal set'.
Found 1 result
-
Hello. I'm trying to animate the filter: blur() css property of an image. I've had some degree of success using an adapted version of a solution I found on another topic (referenced at the bottom of the post). My solution: However, this method works best for large blur values, coupled with a somewhat short animation duration. I want to have a lower maximum blur value. In my example, I'm trying to animate the blur from 0 to 6px. If you see my codepen, the animation staggers, the values are increased one by one, as integers. At first I thought maybe blur() doesn't accept decimal values, but that is not the case. See here a simple test with blur increasing by 0.25px with each step: In the animation codepen, the variable tlp (timeline progress) is indeed a decimal number, but when TweenMax.set uses it to set the value for blur(), I guess it discards the decimal part? How can I avoid this? Thank you. Original codepen from where I based my solution:
