-
-
Save jeduan/1775746 to your computer and use it in GitHub Desktop.
$('a.reveal').click(function(event) { | |
event.preventDefault(); | |
var $div = $('<div>').addClass('reveal-modal').appendTo('body'), | |
$this = $(this); | |
$.get($this.attr('href'), function(data) { | |
return $div.empty().html(data).append('<a class="close-reveal-modal">×</a>').reveal(); | |
}); | |
}); |
Awesome, I took @tilsammans work one step further by filtering out the div I needed (#main)
jQuery('a.reveal').click(function(event) {
event.preventDefault();
var modal = jQuery('<div>').addClass('reveal-modal').appendTo('body');
jQuery.get(jQuery(this).attr('href'), function(data) {
var theData = data;
modal.empty().html(jQuery(theData).filter('#main')).append('<a class="close-reveal-modal">×</a>').foundation('reveal', 'open');
});
});
i'm wondering.
which one is better. using jQuery get or load?
because until now i still can't get this gist working using load :(
@tilsammans Thanks for posting this Foundation 4 work around. It helped me a lot.
@tilsammans so nice to go with. But I got a question.
when window pop up, the background doesn't be dark. just looking same.
And If click the close-button, window would go closing, but background page be dark and nothing can be possible there. Any idea?
@chegoon make sure you are appending it to the body, in other words it should be before the body closing tab
When using the method provided by @benleivian in Foundation 5, be sure to add the data-reveal
attribute to the div...
jQuery('a.reveal').click(function(event) {
event.preventDefault();
var modal = jQuery('<div data-reveal>').addClass('reveal-modal').appendTo('body');
jQuery.get(jQuery(this).attr('href'), function(data) {
var theData = data;
modal.empty().html(jQuery(theData).filter('#main')).append('<a class="close-reveal-modal">×</a>').foundation('reveal', 'open');
});
});
To make this work in Foundation 4 you need to send the foundation message to the div instead of reveal() directly.
in Coffeescript: