2

I really want to be able to open Foundation 5's Reveal Modal through the URL, so lets say if I enter www.website.com/#myModal, it will open once the page has loaded.

Is there any way to do this without using jQuery? I haven't been able to find any posts about it, explaining how to do it in a clean way.

JasonMArcher
  • 14,195
  • 22
  • 56
  • 52
ahog
  • 25
  • 6

1 Answers1

3

What you need to do is fire a function when the page is loaded, that reads out the fragment from the URL ("myModal" in this case), finds a link that has an attribute data-reveal-id="myModal" (which is how Foundation registeres which link opens which modal) and simulate a click on that.

document.addEventListener("DOMContentLoaded", function(event) {
   var id = window.location.hash.substring(1); // remove the #
   var element = document.querySelector('[data-reveal-id="' + id + '"]');

   element.click();
});

The only browser this might not work in is safari because it doesn't support the click() method, but there's a workaround for that

Community
  • 1
  • 1
Stephan Muller
  • 27,018
  • 16
  • 85
  • 126
  • and in case it wasn't clear, you can choose whatever #id_name to use in the url, as long as its the same #id_name as the modal window you trying to target – Gray Ayer Oct 15 '14 at 21:42