4 ms·

I'll admit I'm a bit out of practice with the state of vanilla JS, but it seems like you'll be re-inventing the wheel for simple stuff. Like a collapsible sect

I'll admit I'm a bit out of practice with the state of vanilla JS, but it seems like you'll be re-inventing the wheel for simple stuff. Like a collapsible section that's lightly animated. I worry too about people not considering accessibility. A lot of my bugs day to day is not being able to tab into things like hover menus or being able to activate buttons because someone forgot to consider correct event callbacks. Maybe it's different now, but using a jQuery makes it more likely the code will cover cases like that.

pacaro 4y ago
You bring up some interesting concerns. It's a good example of why there isn't a one size fits all answer. The UK gov site has high standards for these kind of things so will do it right anyway, but for a small shop leaning on a framework makes a lot of sense
Cthulhu_ 4y ago
In 2020, a collapsible section is a matter of adding / removing a classname and a CSS animation; there's a few ways to do so, using jQuery is one, but you don't need thousands of lines of a JS library (network bandwidth + JS interpretation) to achieve that.
- have_faith 4y ago
  Can CSS transitions and animations handle animating to auto height/widths yet?
  - d1sxeyes 4y ago
    I don't think so. One trick I've used to good effect is setting an high max-height, then translating by 100% and removing pointer events.
    - flatcakes 4y ago
      I feel like this solution feels subtly "wrong" if you're animating, because that high max height will be arbitrarily far away from where you'd normally want to animate to. Doubly so for easing out.
      - d1sxeyes 4y ago
        Yeah it's a bit weird, but haven't found a better trick yet.
chipsa 4y ago
Collapsible section? https://developer.mozilla.org/en-US/docs/Web/HTML/Element/details https://developer.mozilla.org/en-US/docs/Web/HTML/Element/de... There's some CSS transition stuff you can add to that to make it lightly animated: https://css-tricks.com/how-to-animate-the-details-element/ https://css-tricks.com/how-to-animate-the-details-element/ Yeah, jQuery might make some things easier, but when possible, using native HTML elements makes things even easier,
- nhinck 4y ago
  Hmm, I would agree that you can do 95%+ of stuff jQuery used to be used for in vanilla js or html/css in a nicer way but animated collapsible divs still require a stupid amount of js to achieve.
  - deleted 4y ago
    [deleted]
  - iCarrot 4y ago
    Animated collapsible div can be done with 0 line of JS. https://code-boxx.com/expand-collapse-div-css-only/ https://code-boxx.com/expand-collapse-div-css-only/
    - nhinck 4y ago
      Uhh, did you check out how that actually functions? It looks like garbage.
      - ThunderSizzle 4y ago
        Agreed, this example looks like total shit.
onion2k 4y ago
I worry too about people not considering accessibility. This isn't a complaint you can level at the gov.uk team. They're obsessed with accessibility. Gov.uk is probably the best example of a well-designed, well-built, completely accessible website on the whole internet.
- psnehanshu 4y ago
  Whilst *.GOV.IN (India) is the worst.
- spicybright 4y ago
  I meant more for anyone building a website.
mitchdoogle 4y ago
If you've been using jQuery for years, know it, and can write a good amount of code without looking at a reference, then by all means, keep using it. It's not going anywhere anytime soon.

pacaro 4y ago

You bring up some interesting concerns. It's a good example of why there isn't a one size fits all answer. The UK gov site has high standards for these kind of things so will do it right anyway, but for a small shop leaning on a framework makes a lot of sense

Cthulhu_ 4y ago

In 2020, a collapsible section is a matter of adding / removing a classname and a CSS animation; there's a few ways to do so, using jQuery is one, but you don't need thousands of lines of a JS library (network bandwidth + JS interpretation) to achieve that.

have_faith 4y ago
Can CSS transitions and animations handle animating to auto height/widths yet?
- d1sxeyes 4y ago
  I don't think so. One trick I've used to good effect is setting an high max-height, then translating by 100% and removing pointer events.
  - flatcakes 4y ago
    I feel like this solution feels subtly "wrong" if you're animating, because that high max height will be arbitrarily far away from where you'd normally want to animate to. Doubly so for easing out.
    - d1sxeyes 4y ago
      Yeah it's a bit weird, but haven't found a better trick yet.

chipsa 4y ago

Collapsible section? https://developer.mozilla.org/en-US/docs/Web/HTML/Element/details https://developer.mozilla.org/en-US/docs/Web/HTML/Element/de... There's some CSS transition stuff you can add to that to make it lightly animated: https://css-tricks.com/how-to-animate-the-details-element/ https://css-tricks.com/how-to-animate-the-details-element/ Yeah, jQuery might make some things easier, but when possible, using native HTML elements makes things even easier,

nhinck 4y ago
Hmm, I would agree that you can do 95%+ of stuff jQuery used to be used for in vanilla js or html/css in a nicer way but animated collapsible divs still require a stupid amount of js to achieve.
- deleted 4y ago
  [deleted]
- iCarrot 4y ago
  Animated collapsible div can be done with 0 line of JS. https://code-boxx.com/expand-collapse-div-css-only/ https://code-boxx.com/expand-collapse-div-css-only/
  - nhinck 4y ago
    Uhh, did you check out how that actually functions? It looks like garbage.
    - ThunderSizzle 4y ago
      Agreed, this example looks like total shit.

onion2k 4y ago

I worry too about people not considering accessibility. This isn't a complaint you can level at the gov.uk team. They're obsessed with accessibility. Gov.uk is probably the best example of a well-designed, well-built, completely accessible website on the whole internet.

psnehanshu 4y ago
Whilst *.GOV.IN (India) is the worst.
spicybright 4y ago
I meant more for anyone building a website.

mitchdoogle 4y ago

If you've been using jQuery for years, know it, and can write a good amount of code without looking at a reference, then by all means, keep using it. It's not going anywhere anytime soon.