javascript - how to center modal window with body hidden after scroll? -
i have model dialog, while model dialog open setting body overflow:hidden
makes model window display half only. onclose resetting body overflow.
body height more window size , scrolled open modal dialog.
how center display modal dialog?
as option, can create function position modal depending on window size, this:
something this:
function repositionmodal(modal){ var windoww = $(window).width(), windowh = $(window).height(), modalw = modal.width(), modalh = modal.height(); if (modalw>windoww) modal.width(windoww); if (modalh>windowh) modal.height(windowh); modal.css({ "top": (windowh-modalh)/2)+"px", "left": (windoww-modalw)/2)+"px" }); }
then call function when modal invoked, and, on window resize
$(window).resize(function(){ if($(".my-modal").is(:visible)){ repositionmodal($(".my-modal")) } })
Comments
Post a Comment