Question

I'm trying to get work modal window in Zurb Foundation 5 on SECTION HTML tag, I get darken page without the windows, just passing the data attribute doesn't work. This modal window works perfectly as a href="#" tag.

Is it possible to use it in common tag?

Section tag code:

<section class="box" onclick="window.location.href='#'" data-reveal-id="myModal-1">

Box:

<div id="myModal-1" class="reveal-modal medium">
  <h1>Header</h1>
  <p>Lorem ipsum</p>
  <a class="close-reveal-modal">&#215;</a>
</div>
Was it helpful?

Solution

You are missing the data-reveal attribute in your modal dialog div, by setting it works fine.

For me work with section elements too with no problems.

Code:

<div id="myModal-1" class="reveal-modal medium" data-reveal>
  <h1>Header</h1>
  <p>Lorem ipsum</p>
  <a class="close-reveal-modal">&#215;</a>
</div>

Demo: http://jsfiddle.net/IrvinDominin/9DAPc/

Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top