Treehouse: Grow your CSS skills. Land your dream job.

Mobile Device Trick

  • # January 24, 2013 at 5:36 pm

    @scottnix Thank you for clarifying. There really is no pure CSS solution (that I know of) to prevent images from loading. He would either have to send the user a different html page or use a combination of PHP, CSS and Javascript to either prevent the image from loading or to load a lower res version of the original image. Here is an interesting site I stumbled upon while trying to find a solution: http://adaptive-images.com/

    # March 6, 2013 at 3:54 pm

    I just wanted to say thanks for all your answers – this totally helped me avoid all the issues of creating two websites for our company. Thanks for sharing your expertise!
    Stephen

    # June 14, 2013 at 1:49 pm

    I’m just wondering about showing some content or not depending om the device. I mean that some content of the the webpage should not be shown if movile device. This is in order to make it lighter for movile devices.

    # June 14, 2013 at 10:50 pm

    What server side scripting language are you using? PHP? or is this in plain HTML?

    If you’re using PHP there is: http://mobiledetect.net/

    # April 7, 2015 at 1:48 pm

    You can prevent images from loading but you would have to use scripting to remove the images from the page before they load. Hiding them does not do this. It simply prevents them from being displayed.

    If you want some images removed but not all, apply a unique class to those images and have the Javascript remove them from the DOM before they are loaded. Otherwise, you can have all images stripped out.

    Another popular technique swaps mobile-optimized versions for each image whenever a mobile device loads the page.

Viewing 5 posts - 16 through 20 (of 20 total)

You must be logged in to reply to this topic.