I have been looking at jQUery thickbox for showing modal dialogs with images, it is great. But now I have the need to display a hidden div of content that contains an iFrame in a similar fashion, with a link to open the content. So I'd have something like this.
<a href="">Open window in Modal Dialog</a>
<div id="myContent">
<h1>Look at me!</h1>
<iframe src="http://www.google.com" />
</div>
And need to show it in the dialog. Is it possible?
Thickbox supports that. See inline content demo at http://jquery.com/demo/thickbox/
I use jqModal and it works nicely and is lightweight. Here is how I get it to work with an iFrame
This is html
<div class="jqmWindow" id="modalDialog">
<iframe frameborder="0" id="jqmContent" src="">
</iframe>
</div>
And the calling code
function showModal(url, height, width)
{
var dialog = $('#modalDialog')
.jqm({
onShow: function(h) {
var $modal = $(h.w);
var $modalContent = $("iframe", $modal);
$modalContent.html('').attr('src', url);
if (height > 0) $modal.height(height);
if (width > 0) $modal.width(width);
h.w.show();
}
}).jqmShow();
}
function closeModal(postback)
{
$('#modalDialog').jqmHide();
}
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With