Please upgrade here. These earlier versions are no longer being updated and have security issues.
HackerOne users: Testing against this community violates our program's Terms of Service and will result in your bounty being denied.

Force Mobile Version on iPad

tonextonex New
edited July 2012 in Vanilla 2.0 - 2.8

I need to force mobile theme on ipad. I read this.

I need a similar solution for ipad. I tried updating /library/core/functions.general.php:

if (preg_match('/(up.browser|up.link|mmp|symbian|smartphone|midp|wap|phone|opera m|kindle|webos|mobile)/i', $UserAgent))

or

if (preg_match('/(up.browser|up.link|mmp|symbian|smartphone|midp|wap|phone|opera m|kindle|webos|ipad)/i', $UserAgent))

Both won't work.

Comments

  • iPad's user agent is similar to : Mozilla/5.0(iPad; U; CPU iPhone OS 3_2 like Mac OS X; en-us) AppleWebKit/531.21.10 (KHTML, like Gecko) Version/4.0.4 Mobile/7B314 Safari/531.21.10

    This is not the latest version of iPad, I just googled it.

  • 422422 Developer MVP

    Why would you force mobile version on ipad? Really curious

    There was an error rendering this rich post.

  • tonextonex New
    edited July 2012

    My background image is fixed. Somehow, a 2400 x 1165 image is still small for an ipad screen (won't fill the whole screen).

  • 422422 Developer MVP

    Then auto scale it.

    There was an error rendering this rich post.

  • x00x00 MVP
    edited July 2012

    The simplest way is to create a div before #Frame then absolute/fixed position it top:0

    inside place an img with width="100%" (I'm deliberately not using css techniques). You could also have an additional cover div after that, though arguably #Frame does that job. z-index shouldn't be need.

    There is css techniques to achieve this, but universal support is not there for backgrounds that scale.

    grep is your friend.

  • Scaling it stretches the background image to ugliness. : )

  • 422422 Developer MVP

    Then change your image lol. You can scale images using jquery, we use technique on www.tranced.com.au

    There was an error rendering this rich post.

  • How about the force to mobile theme option? Not possible?

  • 422422 Developer MVP

    I think the user agent string is fqd in ipads, try http://davidwalsh.name/detect-ipad

    There was an error rendering this rich post.

  • fqd? Strange.

  • ToddTodd Chief Product Officer Vanilla Staff

    We've decided that an ipad is not a mobile version and I don't recommend you try and force it.

    What I do recommend is that you target the ipad specifically with css media queries. Here is the css for an ipad:

    /* iPads (portrait and landscape) ----------- */
    @media only screen 
    and (min-device-width : 768px) 
    and (max-device-width : 1024px) {
    /* Styles */
    }
    
    /* iPads (landscape) ----------- */
    @media only screen 
    and (min-device-width : 768px) 
    and (max-device-width : 1024px) 
    and (orientation : landscape) {
    /* Styles */
    }
    
    /* iPads (portrait) ----------- */
    @media only screen 
    and (min-device-width : 768px) 
    and (max-device-width : 1024px) 
    and (orientation : portrait) {
    /* Styles */
    }
    

    If you really must have a giant static background image then consider using the background-size attribute within your media query.

  • Thanks, Todd. I'll try that one.

Sign In or Register to comment.