Viewing 10 posts - 1 through 10 (of 10 total)
  • Author
    Posts
  • #936457

    Hi,

    I’m using a content section on my website with an image in the background. In the content section I have put an accordeon (content elelement). I have put the background image on fixed. It chose the size “featured big” when oploading the image. The alignment is set on “center center”.
    On my desktop it is working the way I want it. In my mobile screens though, the image is zooming in when I toggle an item. Is there a way to fix this and that is working the same as on my desktop? I want the image to be fixed and not zooming.

    Thanks for helping out!

    #936569

    Hey JantienM,

    Could you post a link to the page in question so that we can take a closer look please?

    Best regards,
    Rikard

    #936611

    Yes, here it is:

    #936850

    Hi,

    That links directs me to a 404 error page, could you please check?

    Best regards,
    Basilis

    #937048

    Oh I’m sorry, meanwhile I’ve changed the name of the page. This is the correct link:

    #937456

    Hi JantienM,

    Could you please attach some screenshots of the issue?

    Best regards,
    Victoria

    #939858

    Hi Victoria,

    Here are two screenshots of my iPad of the page.

    As you can see on this one all toggles are closed (except 2018), the background photo is correct this way:
    http://www.fronikboerderij.nl/nieuw2018/wp-content/uploads/2018/04/IMG_0214.png

    Now, when I toggle 2015 (the first on the right), you see that the background image is zoomed in:
    http://www.fronikboerderij.nl/nieuw2018/wp-content/uploads/2018/04/IMG_0215.png

    I don’t want that to happen. When you open the page on a desktop you will see that the image stays exactly the same when toggling:

    #940726

    Hi,

    The height of the section container increases when you open a toggle. The size of the background image increases as well because it inherits the size of the section container. You can disable the background on mobile view or just replace it with a solid background color.

    @media only screen and (max-width: 1024px) {
    .avia_mobile #top .av-parallax-section {
        background-color: green;
    }
    
    .avia_mobile #top .av-parallax {
        display: none !important;
    }
    }

    Best regards,
    Ismael

    #1015722

    Ok thanks, topic can be closed.

    #1015857

    Hi JantienM,

    Glad you got it working for you! :)

    If you need further assistance please let us know.

    Best regards,
    Victoria

Viewing 10 posts - 1 through 10 (of 10 total)
  • You must be logged in to reply to this topic.