spaceninja + offset-path   3

Movin' Modals Along a Path
Modals always be just appearin'. You might see one once in a while that slides in from one of the edges, or uses some kind of scale/opacity thing to appear from "above" or "below." But we can get weirder than that. Why not have them come in on an offset-path?
fridayfrontend  css  cssbasics  modals  offset-path  animation 
june 2019 by spaceninja
Lesser-known CSS properties in GIFs
I collected here CSS props that I found awesome because they can make websites much diverse in terms of effects and make new trends in the future, at least they definitely will make developers life much easier.
fridayfrontend  cssbasics  css  gifs  element  conic-gradient  motion-path  offset-path  scroll-snap  counters  counter-style 
march 2019 by spaceninja
Chris Coyier | A Tale of Four Properties
There are some values in CSS that allow you to create shapes. For example, you can use the clip-path property and the circle() function to clip and element in a circle of your liking. A circle is a "basic shape" in CSS, just as it is in SVG, and you can use these basic shapes as values for a number of CSS properties. Basic shapes don't include "path" though, which is the ultimate vector defining syntax. In a strange twist, path() does exist in CSS, in places that don't support basic shapes!
fridayfrontend  video  svg  css  shapes  path  tmbg  shape-outside  polygon  circle  ellipse  inset  offset-path  motion-path  clip-path  clip  mask 
january 2018 by spaceninja

Copy this bookmark: