JointsWP-CSS
JointsWP-CSS copied to clipboard
Modal functionality breaks when MotionUI animations are specified
Tested on the latest JointsWP-CSS (Foundation 6.4.3) on a fresh install of Wordpress 4.9.4 with no plugins.
Without animations specified, the modal works:
<button class="button" data-toggle="modal">This modal works</button>
<div class="reveal" id="modal" data-reveal data-close-on-click="true">
<h1>This modal works.</h1>
<button class="close-button" data-close aria-label="Close reveal" type="button">
<span aria-hidden="true">×</span>
</button>
</div>
When animations are specified, the modal doesn't animate and won't close after opening:
<button class="button" data-toggle="animatedModal">This modal doesn't work</button>
<div class="reveal" id="animatedModal" data-reveal data-animation-in="fade-in" data-animation-out="fade-out" data-close-on-click="true">
<h1>This modal doesn't work.</h1>
<button class="close-button" data-close aria-label="Close reveal" type="button">
<span aria-hidden="true">×</span>
</button>
</div>