Viewing 9 posts - 1 through 9 (of 9 total)
  • Author
    Posts
  • #963948

    Hi,

    I use a full screen slider for my landing page. See the image here: https://www.dropbox.com/s/yfwo473wky2ensq/Capture1.PNG?dl=0.
    If the screen is below a width of 989 px, I switch to a full width slider . This goes very well on a desktop computer.

    But…., something strange happens when I view the page on an iPad. Although the iPad has a hires display (2732 x 2048 px), only a very small part of the image has been blown up and displayed. See the image here: https://www.dropbox.com/s/m3y7htuna2f5qy0/Capture2.PNG?dl=0.

    Any suggestions to have a proper image displayed on the iPad?

    Kind regards,
    Henk

    #965093

    Hi Henk,

    Thanks for the login details. Could you try updating the theme to the latest version (4.4) to see if that helps please? https://kriesi.at/documentation/enfold/how-to-install-enfold-theme/#theme-update

    Best regards,
    Rikard

    #965094

    Hi again,

    If updating doesn’t help then please send us a temporary admin login and login URL so that we can have a closer look. You can post the details in the Private Content section of your reply.

    Best regards,
    Rikard

    #965580

    Hi Rikard,

    The theme is updated to the latest version 4.4. Issue on iPad is still present (both Safari and Firefox).
    Please have a look.

    Kind regards,
    Henk

    #967601

    Hi,

    Thanks for the info. What is the actual model of the iPad device? Is it retina? You may need to use larger images, twice that of the current image, because these devices have higher DPI. You can also try this css code to disable the “fixed” attachment property which is a known issue on iOS devices.

    @media 
    (-webkit-min-device-pixel-ratio: 2), 
    (min-resolution: 192dpi) { 
        .avia-fullscreen-slider .avia-slideshow[data-image_attachment="fixed"]>ul>li {
        background-attachment: scroll;
        }
    }
    
    @media only screen
    and (max-device-width : 1024px)  {
         .avia-fullscreen-slider .avia-slideshow[data-image_attachment="fixed"]>ul>li {
        background-attachment: scroll;
        }
    }
    

    The above css code may distort the image a bit.

    Best regards,
    Ismael

    #968070

    Hi Ismael,

    Thanks for your suggestion. This CSS workaround has effect. Great! The image distorts indeed a bit.

    The actual model of the iPad is ‘iPad Pro 12,9” Retina display (2732 x 2048 px).
    However the problem also occurs on an iPad min 3 (2048 x 1536 px) and on the old iPad WiFi (2012) (2048 x 1536 px).

    I prefer not enlarge dpi because I also get a larger image file size which effects response.

    Kind regards,
    Henk

    #970914

    Hi,

    Thanks for the update. We adjusted the above css code a bit. Please try it again.

    Best regards,
    Ismael

    #971568

    Thanks Ismael, This is fine. Issue resolved. Kind regards, Henk

    #972009

    Hi,

    Awesome! Glad we could help!

    Please take a moment to review our theme and show your support https://themeforest.net/downloads
    Don’t forget to bookmark Enfold Documentation for future reference.

    Thank you for using Enfold :)

    Best regards,
    Ismael

Viewing 9 posts - 1 through 9 (of 9 total)

The topic ‘Full screen slider is not responsive on iPad’ is closed to new replies.