As I’m still an idiot when it comes to media queries and mobile devices and can pass this stuff on to other folks – but needed to give myself and the interested parties a visual representation of how different sized graphics will be delivered to different mobile devices… I was after a simple ‘switch’ that would allow a single wedge of HTML to render according to a variable.

The example here goes along the lines of http://example.com?width=340 where the width has a few values it accepts or will default to a preset size…

This variable can then get passed around in the PHP file to set image dimensions, CSS etc…

<?php
function getUrlStringValue($urlStringName, $returnIfNotSet) {    if(isset($_GET[$urlStringName]) && $_GET[$urlStringName] != "")      return $_GET[$urlStringName];    else      return $returnIfNotSet;  }
$width = getUrlStringValue("width", "480");

?><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"><meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<head><title></title><meta name="viewport" content="width=<?php echo $width ;?>" />

Last Updated on