GradePack

    • Home
    • Blog
Skip to content
bg
bg
bg
bg

GradePack

A progress indicator needs to visibly pass through four dist…

A progress indicator needs to visibly pass through four distinct color stages as a task advances, so why would an animation fit this better than a transition?

Read Details

Three loading dots share the same 3-second pulsing animation…

Three loading dots share the same 3-second pulsing animation, but a designer wants them to never all look identical at the same instant, so what technique addresses that without changing the keyframes themselves?

Read Details

Two developers each write an animation that moves an element…

Two developers each write an animation that moves an element 300px to the right — one animates left from 0 to 300px, the other animates transform: translateX() from 0 to 300px — so which one is the better rendering-performance choice, and why?

Read Details

A performance engineer is explaining to a junior developer w…

A performance engineer is explaining to a junior developer why CSS transitions succeeded where JavaScript-driven animation struggled.

Read Details

A developer builds a purely visual CSS spinner div with no r…

A developer builds a purely visual CSS spinner div with no role or aria-label attributes at all, so what problem does that create for a screen reader user?

Read Details

A developer writes animation: pulse 2s ease-in 1s 3 alternat…

A developer writes animation: pulse 2s ease-in 1s 3 alternate both paused; and wants to know which sub-property the value 3 is setting, so using the shorthand’s fixed positional order, which sub-property does it map to?

Read Details

A slide-in notification has both a delay before it starts an…

A slide-in notification has both a delay before it starts and needs to stay in its final position once it finishes, so which single fill-mode value covers both requirements at once?

Read Details

A developer applies will-change: transform to a button insid…

A developer applies will-change: transform to a button inside its :hover rule, intending to prepare it for an animation that only plays on click, so why is that timing a poor fit?

Read Details

An animation repeatedly changes an element’s left and width…

An animation repeatedly changes an element’s left and width values every frame to create a resizing, sliding effect, so what does that force the browser to redo on every single frame?

Read Details

A blockquote component uses ::before with content: “\201C” t…

A blockquote component uses ::before with content: “\201C” to draw a large decorative opening quotation mark, so why is a Unicode escape used instead of just typing a literal quote character into the content string?

Read Details

Posts pagination

Newer posts 1 … 10 11 12 13 14 … 96,694 Older posts

GradePack

  • Privacy Policy
  • Terms of Service
Top