wright67uk Posted November 3, 2012 Share Posted November 3, 2012 How can i load a file based on the screen size of my device? <div data-role="page" id="one"> <?php include("header.php") ?> <!-------------------------------- container Start ----------------------------------------> <div class="container"> <div class="containerInner"> <?php include("nav.php") ?> <?php include("banner.php") ?> <?php include("form.php") ?> </div> </div> <!-------------------------------- container End ----------------------------------------> <?php include("footer.php") ?> </div> So instead of <?php include("form.php") ?> I would like to do <?php include("formSMALL.php") ?> I would want any user with a screen width greater than 240px to be presented with form.php and any user with a screen width of 240px or smaller to be presented with formSmall.php I have the below javascript to detect the screen sizes, however im unsure of how to combine the two. Please, any help will be very much appreciated. Heres the javascript I have for screen detection; <!DOCTYPE html> <html> <body> <script type="text/javascript">// <![CDATA[ document.write("Total Width: " + screen.width); document.write("<br/> Total Height: " + screen.height); // ]]></script> script> </body> </html> Quote Link to comment Share on other sites More sharing options...
haku Posted November 3, 2012 Share Posted November 3, 2012 First, you can't. Javascript executes after the PHP. Second, you are going about this the wrong way. If you are trying to deal with different screensizes, you should read up on responsive web design. This is the current trend on dealing with sites that need to be shown differently depending on screensize (or rather, it's a method of design that allows for a site to work on most/any screen size. Quote Link to comment Share on other sites More sharing options...
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.