search

bigskysoftware / htmx

</> htmx - high power tools for HTML
https://htmx.org
Other
38.19k stars 1.3k forks source link

Extension Point: Slide-In Effect #262

Closed benpate closed 1 year ago

benpate commented 3 years ago

This was mentioned on Discord, so I'm adding it to the list here. Please let me know if this is not the right place to collect this list of extension use cases.

The current swap system for htmx replaces the original content of a container and toggles CSS classes along the way. It would be good if extensions had enough power to implement an alternate way of swapping data -- for instance, with a "slide in" animation that is common on iOS applications.

I'm not sure of what specific features this would require, separate from items that have already been listed here (such as access to the xhr and swap features already in htmx) but perhaps this is a good place to begin the conversation.

benpate commented 3 years ago

One ore quick note. Another similar effect would be where you click on an icon or preview, which then scales up to fill (and replace) the whole web page. This is supposed to be achievable with the "portals" spec, and it should be possible with HTMX too.

With the right extension points, it should just be a matter of CSS.

benpate commented 3 years ago

This repo contains my current work on this project. I'm pretty sure that we can implement this as an extension -- with a couple of enhancements. I'll try to link to those enhancement requests to keep everything connected. But, it's probably OK to just close this specific ticket, unless there's a reason to to bake this feature into htmx (which would probably be the wrong way to go).

dz4k commented 1 year ago

Does the view transitions support obviate this?

benpate commented 1 year ago

View Transitions API would be a slam dunk.. if it were supported by Firefox + Safari, which account for 25% of Internet usage. Still, this was another exploration from 2020 that we can probably just close out :)