media queries in the controller
Permalink
One of the major hurdles in a responsive mobile-friendly design is that the code that runs on your server (in our case the PHP code in the controller) doesn’t have any simple way to get the screen dimensions of the user’s browser.
It would be really nice to be able to control the logic in the controller.php to, for example, not configure a google map if the device has a maximum screen width of 768px (i.e the css media query parameters used to determine if the device is mobile).
There are some nice javascript packages available, such as modernizr.js, that include a function to test the screen width:
if (Modernizr.mq("only screen and (max-width: 768px)")) ….
I can not find a similar php function. Does anyone know of a function or work around to determine the max screen width and ergo the device type using php in the controller?
As a work around I know that I can use media queries in the css file to simply not display the map for mobile users (display: none;) – but mobile users would still need to go through all the map processing in the controller – along with the loading of unneeded scripts, etc. which really slows things down.
Any advice would be sincerely appreciated.
It would be really nice to be able to control the logic in the controller.php to, for example, not configure a google map if the device has a maximum screen width of 768px (i.e the css media query parameters used to determine if the device is mobile).
There are some nice javascript packages available, such as modernizr.js, that include a function to test the screen width:
if (Modernizr.mq("only screen and (max-width: 768px)")) ….
I can not find a similar php function. Does anyone know of a function or work around to determine the max screen width and ergo the device type using php in the controller?
As a work around I know that I can use media queries in the css file to simply not display the map for mobile users (display: none;) – but mobile users would still need to go through all the map processing in the controller – along with the loading of unneeded scripts, etc. which really slows things down.
Any advice would be sincerely appreciated.
PHP is a server-side language and does all it's page processing prior to the content ever reaching the browser so it really has no idea what the screen size is. JavaScript is a client-side language which lives in the client's local browser and so it does have access to the dimensions of the browser window in which it is running. I assure you that if there was a way to do it with PHP, someone would have figured it out by now.
I understand the difference between php and javascript. I was just hoping someone was more clever than I and had come up with a work around.
Wow - Thank you so much. I thing I will be able to work with this to get what I want.
I searched the forums but was looking for terms mobile and media query. Should have used the words mobile and detect.
Thanks again for your help.
I searched the forums but was looking for terms mobile and media query. Should have used the words mobile and detect.
Thanks again for your help.
I never use the C5 search for these things. I just search Google and their results point to these forums. Much more productive.
As a side note. Anyone interested in using mobile_detect.php should know that there is a new/updated version athttp://mobiledetect.net/.
