Register

If this is your first visit, please click the Sign Up now button to begin the process of creating your account so you can begin posting on our forums! The Sign Up process will only take up about a minute of two of your time.

Results 1 to 5 of 5
  1. #1
    Junior Member Olaf_Merchant's Avatar
    Join Date
    Apr 2012
    Location
    Finland
    Posts
    9
    Member #
    31422
    Heya.

    I recently got into studying responsive design for web content, and am making some minor progress in that regard, but not without problems with each new revelation.

    At any rate, my extensive searches have been fruitless (maybe I'm not using the right keywords in my search, dunno), so I thought to turn to the community, once again. What I've been trying to do is creating a div with flash content, that only loads up on desktop computers and tablets. I've tried making heads and tails of image scripts using the same principle I'm after, but so far, I'm not getting anywhere with my experiments.

    So, any nudge in the right way would be appreciated.

  2.  

  3. #2
    Senior Member Webzarus's Avatar
    Join Date
    May 2011
    Location
    South Carolina Coast
    Posts
    3,322
    Member #
    27709
    Liked
    770 times
    What works is a server side module or function that can detect mobile browsers... Search these forums for mobile detection script, I believe I've linked it a couple of times. The site listed has a PHP and an ASP version available.

    The script was originally intended for mobile browser detection and redirection, but can easily be modified to set a session variable, then depending on the vsrie set you can ca different content.

    There are tons of JavaScript detection scripts out there, but he problem that I've had with most of them is if a particular mobile browser doesn't or can't process the JavaScript properly, it either doesn't work at all or worse yet, kicks an error that makes the mobile browser just stop working all together.

    I've not used this particular script for what you're trying to do, but it should be easy enough to create an include for the top of the page ( if you don't already have one ), set a session variable, use that session variable in an if then else statement to check for that variable again whenever a page is loaded, and to determine what content to load.

    If and when newer user agents for mobile devices come out, easy enough to add them to this function.

  4. #3
    Junior Member Olaf_Merchant's Avatar
    Join Date
    Apr 2012
    Location
    Finland
    Posts
    9
    Member #
    31422
    Ah, right. The mobiforge 'Lightweight Device Detection in PHP/ASP'? I'll give that a go. I'm just a tad worried if it's still a working solution (seems like the last activity was a year ago, and the script itself was posted more than five years ago.

  5. #4
    Junior Member Olaf_Merchant's Avatar
    Join Date
    Apr 2012
    Location
    Finland
    Posts
    9
    Member #
    31422
    I did a bit of snooping, and found the following script:

    Code:
    function mediaqueryload(ev) {
      var queriedresource = document.querySelectorAll('.mediaquerydependent'),
          all = queriedresource.length,
          i = all,
          current = null,
          attr = null;
      if (ev && ev.type === 'resize') {
        while (i--) {
          current = queriedresource[i];
          for (attr in current.dataset) {
            current.removeAttribute(attr);
          }
        }
        i = all;
      }
      while (i--) {
        current = queriedresource[i];
        if (  current.dataset.media &&
              window.matchMedia(current.dataset.media).matches) {
          for (attr in current.dataset) {
            if (attr !== 'media') {
              current.setAttribute(attr, current.dataset[attr]);
            }
          }
        }
      }
    }
    mediaqueryload();
    window.addEventListener('resize', mediaqueryload, false);
    Seems to work well for static images, but so far, I've yet to manage to latch it unto the flash banner with any amount of success. Tried implementing the same values into the flash object:

    class="mediaquerydependent" data-media="screen and (min-width: 600px)"

    But still ending up with the usual flash content being shown (more or less) in mobile resolutions.

  6. #5
    Junior Member Olaf_Merchant's Avatar
    Join Date
    Apr 2012
    Location
    Finland
    Posts
    9
    Member #
    31422
    I ended up going with your original suggestion about mobile Redirect- it will at least be a working solution, until I have managed to compile a working code and field test it thoroughly.

    Old ways are the best ways, eh?


Remove Ads

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
All times are GMT -6. The time now is 05:28 PM.
Powered by vBulletin® Version 4.2.3
Copyright © 2019 vBulletin Solutions, Inc. All rights reserved.
vBulletin Skin By: PurevB.com