javascript - jQuery popup resize on phone -


i have small problem popup image displaying on mobile browser. popup displayed on mouse click , resize function sets size according viewport size.

this works fine , centred in viewport when opened, when tilt phone landscape call resize function doesn't seem work newly resized image off centre in viewport, repeated when phone returned portrait mode. have tested code on android chrome browser.

the resize function have used follows:

$(window).resize(function () {     $(".dialogcontent").css({         position: 'absolute',         left: ($(window).width() - $(".dialogcontent").outerwidth()) / 2,         top: ($(window).height() - $(".dialogcontent").outerheight()) / 2     }); }); 

sorry posting answer still can't comment yet.

based on have said little confused mouse click portion of code. surly resize function not being called when user clicks button first time. sure working way want @ all?

to answer question limited amount of understanding of code looks like

it should like:

 $(".dialogcontent").css({     position: 'absolute',     left: '50%',     'margin-left': $(".dialogcontent").outerwidth() / 2,     'margin-top': $(".dialogcontent").outerheight() / 2,     top: '50%' }); 

from understanding centre align positioned absolute set it's top , left 50% , offset positioned absolute element half.

now i'm home can make fiddle here


Comments

Popular posts from this blog

html - Sizing a high-res image (~8MB) to display entirely in a small div (circular, diameter 100px) -

java - IntelliJ - No such instance method -

identifier - Is it possible for an html5 document to have two ids? -