Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Foundation 5 modal not working

I'm sure I'm making a silly mistake but it took me hours and I couldn't find any solution for my problem. Everything seems ok but not working. I'm using Foundation 5 reveal. But modal window does not show. Here is my code:

HTML

<a class="openModal" href="#" data-reveal-id="imagemodal"><img src="image.jpg" /></a>
<div id="imagemodal" class="reveal-modal" data-reveal>Modal</div>

I've also included the following js files in body tag:

<script type="text/javascript" src="js/foundation/foundation.js"></script>
<script>
    $(document).foundation();
</script>
<script type="text/javascript" src="js/foundation/foundation.reveal.js"></script> 

Any help is appreciated in advance.

like image 791
Beginner Avatar asked Jan 22 '26 11:01

Beginner


1 Answers

Put the call to foundation.reveal.js before you call $(document).foundation();.

I'm pretty sure this is because $(document).foundation(); initiates only those modules that have been specified prior to it, something that Foundation doesn't make clear in its notes.

Foundation offers you options to customize plugin initialization. By default, calling $('#scope').foundation(); will initialize all available plugins on the page.

like image 102
Andy Avatar answered Jan 25 '26 01:01

Andy



Donate For Us

If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!