5 ms·

> That's going to be the best things since sliced bread, lots of code I can simplify, bugs that will be easier to close. Other people won't have a need, and so

> That's going to be the best things since sliced bread, lots of code I can simplify, bugs that will be easier to close. Other people won't have a need, and so don't need to even touch it. Just glancing it looks like it would simplify tooltips. Does it have wider implications than that?

samwillis 3y ago
Downdown/context menus that are attached to a node inside an "overflow: scroll" element. The common solution is to use a React "portal" or Vue "teleport" to move the element to the root of the body, but this has its own problems around accessibility and can often result in bugs during page transitions.
- noduerme 3y ago
  You don't need vue or react. Just get the x/y coords of the child relative to the parent and attach the dropdown element in an absolute position to those. A little measurement of the window and the elements is all that's necessary. People reach for these stupid frameworks with a million lines of code to do these incredibly trivial things you can do in 4 lines of Javascript.
noduerme 3y ago
Tooltips and fixed dropdowns pinned to the position of page elements are already fairly trivial to do... so are modals... so are dialog boxes... so are every other thing that needs to "Pop Up" on your webpage. I predict a very fast death spiral for this tag, in which 99% of the uses will be obnoxious. You know how, uh, ad blockers used to be called "popup blockers"? There's an order, a z-indexing that creates a syntax and a hierarchy in everything you build. Sometimes you have to jump it with absolute positioning. Which already exists for this exact purpose. CSS itself has suffered from this same line of thinking, like, "what if something has to override a class and override a style, should we call it !important? Yeah!"
- limitedmage 3y ago
  On a large complex single page webapp, it can be very non-trivial to have a popup/modal over everything else in the page. That’s why things like React Portals[0] exist, as well as many, many libraries that provide similar functionality. z-index is not an absolute number and depends on your stacking context. [0] https://react.dev/reference/react-dom/createPortal https://react.dev/reference/react-dom/createPortal
  - noduerme 3y ago
    How is what that's doing any different from figuring out element A's desired position in the coordinate space of the body, or in the local coordinate space of element B, and then appending it to one or the other in an absolute positioned wrapper? I've written very large single page webapps that have dropdown menus with sub-menus that are almost entirely CSS with just small amounts of vanilla JS to adjust their screen positions. Sometimes a really lightweight library is useful, but requiring the whole React framework seems like total overkill. On the other hand, adding a new HTML tag for the purpose of popup modals seems unnecessary.

samwillis 3y ago

Downdown/context menus that are attached to a node inside an "overflow: scroll" element. The common solution is to use a React "portal" or Vue "teleport" to move the element to the root of the body, but this has its own problems around accessibility and can often result in bugs during page transitions.

noduerme 3y ago
You don't need vue or react. Just get the x/y coords of the child relative to the parent and attach the dropdown element in an absolute position to those. A little measurement of the window and the elements is all that's necessary. People reach for these stupid frameworks with a million lines of code to do these incredibly trivial things you can do in 4 lines of Javascript.

noduerme 3y ago

Tooltips and fixed dropdowns pinned to the position of page elements are already fairly trivial to do... so are modals... so are dialog boxes... so are every other thing that needs to "Pop Up" on your webpage. I predict a very fast death spiral for this tag, in which 99% of the uses will be obnoxious. You know how, uh, ad blockers used to be called "popup blockers"? There's an order, a z-indexing that creates a syntax and a hierarchy in everything you build. Sometimes you have to jump it with absolute positioning. Which already exists for this exact purpose. CSS itself has suffered from this same line of thinking, like, "what if something has to override a class and override a style, should we call it !important? Yeah!"

limitedmage 3y ago
On a large complex single page webapp, it can be very non-trivial to have a popup/modal over everything else in the page. That’s why things like React Portals[0] exist, as well as many, many libraries that provide similar functionality. z-index is not an absolute number and depends on your stacking context. [0] https://react.dev/reference/react-dom/createPortal https://react.dev/reference/react-dom/createPortal
- noduerme 3y ago
  How is what that's doing any different from figuring out element A's desired position in the coordinate space of the body, or in the local coordinate space of element B, and then appending it to one or the other in an absolute positioned wrapper? I've written very large single page webapps that have dropdown menus with sub-menus that are almost entirely CSS with just small amounts of vanilla JS to adjust their screen positions. Sometimes a really lightweight library is useful, but requiring the whole React framework seems like total overkill. On the other hand, adding a new HTML tag for the purpose of popup modals seems unnecessary.