Fullscreen slider on mobile

Hey AnneliesUL,

Yes, there should be a solution to that. Would you give us a link to the page with the fullscreen slider? so we can check it further.

Best regards,
Nikko

Hi,

Try to replace this code:

@media only screen and (max-width: 480px) {
.avia-fullscreen-slider .avia-slideshow>ul>li {
background-size: 100% 100%;
background-repeat: no-repeat;
}
}

to:

@media only screen and (max-width: 480px) {
  .avia-fullscreen-slider .avia-slideshow>ul>li {
    background-size: auto 100%;
    background-position: center center !important;
    background-repeat: no-repeat;
  }
}

Hope this helps :)

Cheers!
Nikko

Hi,

Can you post a screenshot on how it looks on your mobile phone when the code I gave is used? you can upload it on http://imgur.com/ and post the link here. Basically what I suggested above was replacing this part of the code:
background-size: 100% 100%;
to this one:
background-size: auto 100%;
this means the background’s width will be auto and height to 100%, by using this code it would make sure that the background won’t be stretch though some part of it won’t be seen. And adding this code:
background-position: center center !important;
Which basically says to use the center as the base instead of top and left part of the background image (which is the default), so by adding the code I gave would result in the woman with curly hair to show as background image, though the other person won’t be seen.

Cheers!
Nikko