0

thanks for reading...

It is my understanding (which my be wrong) content hidden with css loads but is kept hidden. Rather than using media queries to toggle hidden/visible content depending on the device, I was wondering if it is possible to use jquery on the page load to get the viewport width... and then write the width to mysql... and then retrieve the width with php on the same page without a page re-load.

If so, how would the jquery be written?

Thanks in advance for taking the time to read, Pete

petebolduc
  • 1,233
  • 1
  • 13
  • 20
  • You could get the viewport [this](http://stackoverflow.com/questions/3044573/using-jquery-to-get-size-of-viewport) way, then you need to use ajax by sending it to server. –  Feb 25 '14 at 14:12
  • Thank you vlzvl for you response. I have tried to use ajax to send the var to the database but being new to ajax I'm sure i got a few errors in the code. The goal is to allow for php if statements depending on the viewport. Presently my script uses media queries which hides content such as menus too large for handhelds and show the menu for the appropriate size. My concern is both load time (loading the code for both but only show the one) and google's response to the same links being loaded with the one hidden. Input and clarification on if my concerns are valid would be appreciated. – petebolduc Feb 25 '14 at 18:02
  • Sadly, i'm not too familiar with your issue (handheld devices and such) but why not avoiding rendering the parts in server-side with php instead of ignoring them with css/javascript on client-side? nowadays there are php tools to detect from where the request got from; then you could rendering on correct sizes. But in anycase your concern is valid only if the content on hidden parts is big enough to causing slowdowns, but then you could just enable compression on your HTML using .htaccess –  Feb 25 '14 at 18:13
  • Thanks again, I do have a nice php script that does identify the requesting device and have been considering that option. Presently I'm testing accomplishing the task through jquery alone by using if statements based off of the a viewport variable and changing the html for the given divs. Not sure if this would be a speed issue though but it would only render the links once. I am commpressing through htaccess. – petebolduc Feb 25 '14 at 19:39

1 Answers1

0

My Found Solution:

After spending the day yesterday testing and trying different approaches I found this plugin this morning which solved my problem.

The goal was to prevent the loading of hidden code depending on viewpoint size. My original programming used toggles shown/hidden by media queries. Use of the Mobile Detect plugin allows the use of php if statements depending on device. A recommended plugin for sure.

petebolduc
  • 1,233
  • 1
  • 13
  • 20