You’d need to modify the JS file and add an onOpen callback to the $.modal(); function call.
Example:
$('#simplemodal-login-form').modal({
overlayId: 'simplemodal-login-overlay',
containerId: 'simplemodal-login-container',
opacity:85,
onOpen: SimpleModalLogin.open,
onShow: SimpleModalLogin.show,
position: ['15%',]
});
Then, after the show: function, add the open function:
open: function (dialog) {
// your effects go here. Random example below
dialog.overlay.fadeIn('slow', function () {
dialog.data.hide();
dialog.container.fadeIn('slow', function () {
dialog.data.slideDown('slow');
});
});
},
HTH
I think I may be coding this wrong since I am new at JS
Are you saying right after
show: function (obj) {
var dialog = this,
form = $('#loginform', obj.data[0]);
I paste in your example and that’s it or am I missing another step?
Basically I would like these effects on my default
Opening
// Opening animations
$("#sample").modal({onOpen: function (dialog) {
dialog.overlay.fadeIn('slow', function () {
dialog.data.hide();
dialog.container.fadeIn('slow', function () {
dialog.data.slideDown('slow');
});
});
}});
Closing
// Closing animations
$("#sample").modal({onClose: function (dialog) {
dialog.data.fadeOut('slow', function () {
dialog.container.hide('slow', function () {
dialog.overlay.slideUp('slow', function () {
$.modal.close();
});
});
});
}});
I found these on your site under examples of simple modal, If you can help me fisgure this out I would most appreciate it, Thanks.
Well I figured out the opening effects
I edited the default js to look like this
$('#simplemodal-login-form').modal({
overlayId: 'simplemodal-login-overlay',
containerId: 'simplemodal-login-container',
opacity:75,
onOpen: SimpleModalLogin.open,
onShow: SimpleModalLogin.show,
position: ['15%',]
});
});
},
open: function (dialog) {
// your effects go here. Random example below
dialog.overlay.fadeIn('slow', function () {
dialog.data.hide();
dialog.container.fadeIn('slow', function () {
dialog.data.slideDown('slow');
});
});
},
Now I am just having trouble with the closing effects. I would think it would be just adding an onClose but I guess I am not doing it right?
Hey Issak,
Sorry for missing your comments. You should be able to add a close function tot he SimpleModalLogin object and then add onClose: SimpleModalLogin.close to the modal options.
If you’d like to send me a link or your code, I can take a look.
-Eric
I am not sure which code to send your way, The js? If so i provided a link below,
http://www.consolealliance.com/wp-content/uploads/2010/08/default.js
thanks in advance.
Hi isaak
You site is awesome and your customizationa of the plugin is too good http://www.consolealliance.com/wp-login.php?action=register can you make it open source so that its usefull o every one..
Isaak looks like got what he wants from here, by the way. @ezhil, he used http://simple-press.com/.