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?

enter image description here

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

Popular posts from this blog

c++ - Function signature as a function template parameter -

algorithm - What are some ways to combine a number of (potentially incompatible) sorted sub-sets of a total set into a (partial) ordering of the total set? -

How to call a javascript function after the page loads with a chrome extension? -