I am looking to develop a webpage using HTML/CSS/Javascript that can display an advertisement in full screen on mobile devices like smartphones and tablets. The ad should expand to the maximum width and height of the screen without any scrollbars.
I have tried two different approaches:
var screenWidth = $(window).width();
var screenHeight = $(window).height();
$('body, .ads-picture').css('width', screenWidth+'px');
$('body, .ads-picture').css('height', screenHeight+'px');
I also attempted using media queries for individual devices.
However, both methods did not work as expected. On iPhone 5, the picture does not occupy the entire screen (resulting in scrolling), and the same issue occurs on iPad mini.
Can anyone provide assistance with this? Thank you!