Viewing 9 posts - 1 through 9 (of 9 total)
  • Author
    Posts
  • August 31, 2016 at 4:49 pm #680136
    navindesigns

    so when the images on the homepage swish/changes on the slider, you see the next image half way before it slides

    Screenshot – https://s12.postimg.io/gu8yg6by5/Whats_App_Image_2016_08_31_at_10_45_44_AM.jpg

    is this something we can fix?

    http://www.elite-fit.com/

    August 31, 2016 at 5:15 pm #680178
    Vinay

    Hey navindesigns,

    Please remove the below custom css added to child theme styles to fix this issue.

    @media only screen and (max-width: 768px)
.av_slideshow_full li img {
    width: 150% !important;
    max-width: 150% !important;
    margin-left: -25%;
}}

    Best regards,
    Vinay

    August 31, 2016 at 5:31 pm #680206
    navindesigns

    ok I removed the code but now on mobile the slider text is not visible. It’s too stretched and we can’t read

    the idea behind that other code was to make my slider a bit bigger on mobile so that text is legible (the text is part of the image)

    do you have any suggestion for a fix on mobile?

    September 2, 2016 at 5:23 pm #681406
    Yigit

    Hi!

    This is the expected behaviour of the transition you chose. Please edit your slider and change “Slideshow Transition” to “fade”.

    Regards,
    Yigit

    September 2, 2016 at 5:41 pm #681415
    navindesigns

    No. the images are being stretched. That has nothing to do with the transition, Please take a look again

    My goal on mobile is to have the text below be legible. I may have inserted some code that is causing that streteched

    I dont mind the images being cropped a little on the sides on mobile just for the text below to be legible

    thanks

    http://www.elite-fit.com/

    September 2, 2016 at 5:47 pm #681420
    Yigit

    Hi!

    Can you please try removing following code and check if that helps 

    @media only screen and (max-width: 768px) {
.avia-slideshow-inner, .avia-slideshow-inner img {
    height: 200px !important;
}}

    Regards,
    Yigit

    September 2, 2016 at 5:55 pm #681425
    navindesigns

    Ok that removed the stretching but now the text is extremely small

    any suggestions to make the text a bit more legible on the smallest mobile device size?

    maybe can we make it a little longer but cropped a little of the sides?

    I think we just have to find an inbetween amount to stretch it

    • This reply was modified 8 years, 3 months ago by navindesigns.
    September 2, 2016 at 5:59 pm #681429
    Yigit

    Hi!

    You can refer to this post – http://kriesi.at/documentation/enfold/hide-menu-itemselements-on-mobile/ and display different sliders on mobile and on desktop.

    Cheers!
    Yigit

    September 8, 2016 at 3:54 pm #683763
    navindesigns

    thanks

  • Author
    Posts
Viewing 9 posts - 1 through 9 (of 9 total)
  • The topic ‘Image slider transition issue on mobile’ is closed to new replies.