Question

Is there a way that I could trigger an onresize() event for my window in javascript/jQuery?

I tried:

$(window).resize();

but that didn’t seem to work exactly as expected. The simplemodal jQuery plugin gives you the option to autoPosition your modal window. Sometimes in IE, the modal shows up a little off center but as soon as I manually make a change to the window size it centers perfectly. So I want to just trigger the onresize event so this will automatically center with the autoPosition of simplemodal set to true.

Ok, I think part of my problem was that I was trying to make the height of the modal dynamic, if the content would change in the modal by showing or hiding elements, so would the size respectively.

Heres my modal call:

$(selector).modal({
    //autoPosition: true,
    //autoResize: true,
    onShow: function(dlg) {
        $(dlg.container).css('height', 'auto') // dynamic height based on content
    },
    onOpen: function(dialog) {
        dialog.overlay.fadeIn('slow', function() {
            dialog.data.hide();
            dialog.container.fadeIn('slow', function() {
                dialog.data.slideDown('slow');
            });
        });
    },
    onClose: function(dialog) {
        dialog.data.fadeOut('slow', function() {
            dialog.container.hide('slow', function() {
                dialog.overlay.slideUp('slow', function() {
                    $.modal.close();
                });
            });
        });
    }
});

If I comment out the onShow attribute, things work again. So I guess maybe that was part of the issue. Is there a way to resize the modal dynamically based on a content, that won’t creat this problem ?

Using simplemodal-1.3.4

Answer 1

Your approach should work, but may not trigger the simplemodal event you want, example:

$(window).resize(function() {
  alert("resized");
});
$(window).resize(); //alerts "resized"

A solution for your particular problem might be:

$(window).trigger('resize.simplemodal');