The default animationSelector is a broader match than described in the docs #226
Description
Describe the problem 🧐
The default animation selector doesn't behave as described in the docs:
The default option will select all elements with class names beginning in transition-.
The selector containing an asterisk class*="transition-" is matching everything containing a class with given selector, including class="something-transition-else".
f.ex.
<header id="header" class="header-transition-start">
…
</header>
<main id="swup" class="transition-main">
…
</main>
On my current project the transition time accumulated due to several non-related and prefixed transitions. I didn't know why until I took a closer look at the default selector.
Describe the propsed solution 😎
Could you either reflect it in the docs (containing instead of beginning), or change the default selector to '[class^="transition-"]'?
Alternatives considered 🤔
Of course it's easy to change the selector it in the options during initialization. 🤝
{
animationSelector: '[class^="transition-"]'
}
How important is this feature to you? 🧭
Nice to have
Checked all these? 📚
- I have read and searched the official docs
- I have checked discussions and existing issues for related problems
- I agree to follow this project's Code of Conduct
- I have provided all necessary information to the best of my knowledge