Hello everyone, I've implemented a JavaScript code that triggers an image to slowly appear and darken the background when a link is clicked. However, on an iPad, the background doesn't completely turn black as intended. The CSS specifies that the background should cover 100% of the screen. Here's the relevant part of the CSS:
#backgroundPopup{
display:none;
position:fixed;
_position:absolute; /* hack for internet explorer 6*/
width:100%;
height:100%;
top:0;
left:0;
background:#000000;
border:1px solid #cecece;
z-index:5;
}
Upon debugging, I noticed that the screen size is only detected initially when the browser loads. In the case of iPads, the screen may be zoomed in or orientation changed leading to some white spots showing up. Is there a way to continuously track screen size changes using JavaScript? Any suggestions?