htmx 4.0 is under construction — migration guide

htmx.config.morphSkip

Skip morphing for specific elements

The htmx.config.morphSkip option is a CSS selector for elements to skip during morphing.

Matching elements won’t be morphed. They stay exactly as they are.

Default: undefined

Example

htmx.config.morphSkip = ".no-morph";
<meta name="htmx-config" content='{"morphSkip":".no-morph"}'>

Usage

<body hx-swap:inherited="innerMorph"> <div class="no-morph"> <!-- Never morphed. Stays frozen. --> </div> <div> <!-- Morphed normally --> </div> </body>

Use Cases

Third-party widgets: Preserve complex widgets that manage their own state.

Active animations: Skip elements with ongoing CSS or JavaScript animations.

Client-side state: Protect elements with complex state that would be lost.

Multiple selectors:

htmx.config.morphSkip = ".widget, .animated, custom-element";