Jump to content
GreenSock

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

Search the Community

Showing results for tags 'calc()'.

  • Search By Tags

    Type tags separated by commas.
  • Search By Author

Content Type


Forums

  • GreenSock Forums
    • GSAP
    • Banner Animation
    • Jobs & Freelance
  • Flash / ActionScript Archive
    • GSAP (Flash)
    • Loading (Flash)
    • TransformManager (Flash)

Product Groups

  • Club GreenSock
  • TransformManager
  • Supercharge

Categories

There are no results to display.


Find results in...

Find results that contain...


Date Created

  • Start

    End


Last Updated

  • Start

    End


Filter by number of...

Joined

  • Start

    End


Group


Personal Website


Twitter


CodePen


Company Website


Location


Interests

Found 3 results

  1. Hello all. I know using calc in JS is not recommended. But as long as it is not in the not supported category, I'd call these bugs. Click the toggle button twice and now the h1 has top: 4.75px instead of calc(1vh). I don't know if GSAP is trying to optimize something, but even if it is it should set 1vh, not 4.75px. https://codepen.io/taylankasap/pen/ZEWMLbB It's jumping to some huge values. https://codepen.io/taylankasap/pen/YzqONVR It is changing values (see devtools) even when from and to are same. https://codepen.io/taylankasap/pen/MWyqJdO
  2. Hi I have problem when animating with CSS calc(). It's just jump to new position, without delay and animation. Is there any special way to do css math when tweening? How to make tween relative to viewport or container?
  3. I'm wondering why I have to explicitly set CSS properties that use calc() with GSAP before being able to Tween to a calculated value? It doesn't matter if the value is set with CSS beforehand, I still have to register it with GSAP before being able to animate it. // Have to set if first TweenMax.set(element, { width: "calc(25% - 10px)" }); // Now I can tween it TweenMax.to(element, 0.5, { width: "calc(100% - 10px)" });
×