I am using SimpleModal (http://www.ericmmartin.com/projects/simplemodal/). I am trying to get an animation to work with the iframe window.
I have the iframe part working :
// Load dialog on click
$('#clicky').click(function (e)
{
$.modal('<iframe src="' + src + '" height="450" width="800" style="border:0">',
{
closeHTML:"",
containerCss:{
backgroundColor:"#fff",
borderColor:"#fff",
height:450,
padding:0,
width:800
},
overlayClose:true
});
});
but I do not know how to connect it to the animation segment:
$("#sample").modal({onOpen: function (dialog)
{
dialog.overlay.fadeIn('slow', function (){
dialog.data.hide();dialog.container.fadeIn('slow', function () {
dialog.data.slideDown('slow')
});
});
So I was hoping to learn how to connect the iframe modal to a fade-in/fade-out animation. May anyone help me or direct me to a site that I can study, please? Thank you
Well, I figured it out. Here's the code that works for me:
$('#clicky').click(
function (e)
{
$.modal('<iframe src="' + src + '" height="450" width="1800" style="border:0">',
{
closeHTML:"",
containerCss:
{
backgroundColor:"#fff",
borderColor:"#fff",
height:450,
padding:0,
width:800
},
overlayClose:true,
//below adds a open animation
onOpen: function (dialog){
dialog.overlay.fadeIn('slow');
dialog.data.show();
dialog.container.fadeIn('slow');},
//below adds a close animation
onClose: function (dialog){
dialog.data.fadeOut('slow');
dialog.container.hide('slow');
dialog.overlay.slideUp('slow', function () {$.modal.close();});
}
});
});
don't forget to put a website for the src variable :)