4 ms·

The "gap between CSS and JS" you are describing is called "decoupling" and it exists because the designers of CSS/HTML/JS have generally been experienced enough

The "gap between CSS and JS" you are describing is called "decoupling" and it exists because the designers of CSS/HTML/JS have generally been experienced enough developers to know how bad of an idea it is to couple your styling and your business logic. There are two kinds of developers: ones who think this is a reasonable idea, and ones who have written UIs in languages that allow this kind of coupling and learned from their mistakes.

LoSboccacc 11y ago
sadly it seems the css v3 spec was written by the latter developers, with transforms violating cascading principles, pseudo elements not readable from the model and keyframe animations being a shit to control all around, so we're stuck with patchwork bridges to make it all work reasonably.
herbst 11y ago
Agreed. I was forced to work with JS-in-CSS and i still dont get their reasoning behind it at all. All use cases in their examples were easily solveable with CSS if you fixed up a bit of the bad CSS they shipped with. It was just a very lazy approach to handle something they lost control for.
- err4nt 11y ago
  Can you give an example where somebody used JS inside CSS for a solution CSS alone could have provided? EDIT: I can't seem to reply down below, but in my plugin for example we've implemented a few responsive conditions: - min-scroll-x - max-scroll-x - min-scroll-y - max-scroll-y So if you needed to trigger a style (or a whole block of styles) when the page, or any element you specify has a scroll position meets the conditions above. By combining these conditions with other conditions, it makes it DEAD simple for CSS-only designers to be able to write responsive JavaScript! @element 'body' and (min-width:900px) and (min-scroll-y: 100vh) { header { position: fixed; } }
  - herbst 11y ago
    I cant simply provide a solution for your edit thats true. But i assume this to create massive overhead just to enable CSS do something it never was supposed to? It maybe just does not fit into my world view, but thats simply wrong to my eyes CSS is not supposed to know that much about the view.
  - herbst 11y ago
    Sure. Most of the time they used it to trigger jQuery fadeIn/fadeOut or move boxes which would have moved if the CSS would have followed a basic grid system other than a <div> construct reassembling tables. Its a worstcase probably, but i also do not find any sitations where it would make more sense to traditional methods.
err4nt 11y ago
Theres actually three types of developers. You forgot about ones who have been building stuff for a decade and a half, run up against the limitations of their tools, and personally set out to extend them. Thats more the type I am :)
- devishard 11y ago
  That description does not exclude you from either of the categories I described.

LoSboccacc 11y ago

sadly it seems the css v3 spec was written by the latter developers, with transforms violating cascading principles, pseudo elements not readable from the model and keyframe animations being a shit to control all around, so we're stuck with patchwork bridges to make it all work reasonably.

herbst 11y ago

Agreed. I was forced to work with JS-in-CSS and i still dont get their reasoning behind it at all. All use cases in their examples were easily solveable with CSS if you fixed up a bit of the bad CSS they shipped with. It was just a very lazy approach to handle something they lost control for.

err4nt 11y ago
Can you give an example where somebody used JS inside CSS for a solution CSS alone could have provided? EDIT: I can't seem to reply down below, but in my plugin for example we've implemented a few responsive conditions: - min-scroll-x - max-scroll-x - min-scroll-y - max-scroll-y So if you needed to trigger a style (or a whole block of styles) when the page, or any element you specify has a scroll position meets the conditions above. By combining these conditions with other conditions, it makes it DEAD simple for CSS-only designers to be able to write responsive JavaScript! @element 'body' and (min-width:900px) and (min-scroll-y: 100vh) { header { position: fixed; } }
- herbst 11y ago
  I cant simply provide a solution for your edit thats true. But i assume this to create massive overhead just to enable CSS do something it never was supposed to? It maybe just does not fit into my world view, but thats simply wrong to my eyes CSS is not supposed to know that much about the view.
- herbst 11y ago
  Sure. Most of the time they used it to trigger jQuery fadeIn/fadeOut or move boxes which would have moved if the CSS would have followed a basic grid system other than a <div> construct reassembling tables. Its a worstcase probably, but i also do not find any sitations where it would make more sense to traditional methods.

err4nt 11y ago

Theres actually three types of developers. You forgot about ones who have been building stuff for a decade and a half, run up against the limitations of their tools, and personally set out to extend them. Thats more the type I am :)

devishard 11y ago
That description does not exclude you from either of the categories I described.