Viewing 8 posts - 1 through 8 (of 8 total)
  • Author
    Posts
  • April 11, 2016 at 10:44 am #611105
    Luisgasser

    Hello, i have an fullscreen background image on my frontpage and want to scale it for mobiles.

    Now i have just a cutting of the Background image.

    How can i fix it?

    Thank you for helping!

    April 11, 2016 at 2:27 pm #611314
    Yigit

    Hey Luisgasser!

    Please choose “Scale to fit” options and if that does not help, please create a temporary admin login and post it here privately.

    Regards,
    Yigit

    April 11, 2016 at 2:36 pm #611327
    Luisgasser

    Hi, I’m using the fullscreen slider, there are no option “scale to fit

    look at the link please so you can see what i mean.

    Thank you!

    April 11, 2016 at 4:23 pm #611423
    Jordan

    Hey!

    Could you please provide login details to your site, so that we can have a closer look. You can place the information in the Private Content section of your reply.

    Cheers!
    Jordan

    April 11, 2016 at 4:43 pm #611441
    Luisgasser

    I send it in pvt

    April 12, 2016 at 6:05 pm #612056
    Andy

    Hey!

    use this code inside of Quick CSS field:

    @media only screen 
  and (max-device-width: 736px) {
.av-single-slide.slide-1.active-slide {
background-repeat: no-repeat;
background-size: 702px 353px;
background-position: -50px 0px !important;
}}

    and adjust as needed.

    Regards,
    Andy

    April 13, 2016 at 7:32 am #612464
    Luisgasser

    Hi,
    thank you! But it doesn’t change anything – also if i adjust max-divice-width and background-size.

    April 15, 2016 at 7:24 am #614592
    Ismael

    Hi!

    The Scale to fit option is not available because you don’t have the latest version of the theme, 3.5.1. Note that this option may leave white spaces in the container because it will not force the image to fill up the whole container. How do you want to resize the image on mobile? It is not possible to show the whole image inside the slider container without distorting it. Another workaround is to adjust the background position. 

    @media only screen and (max-width: 989px) {
.avia-fullscreen-slider .avia-slideshow>ul>li {
    background-position: left center !important;
}
}

    The pizzeria building will be in focus because of this css code.

    Regards,
    Ismael

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