Tagged: 

Viewing 9 posts - 1 through 9 (of 9 total)
  • Author
    Posts
  • October 4, 2020 at 11:07 am #1250387
    uribinsted

    HI,
    I have a problem with the fullwidth slider, once I added the minimum height to 250px it pushed the slider image to the left and leaves almost 50% of the slider empty on the mobile screen size.
    When I canceled the minimum height it looks fine ( fullwidth )

    Hope you guys can help me solve this problem.

    Uri

    October 6, 2020 at 9:33 am #1250772
    uribinsted

    ?

    October 6, 2020 at 6:57 pm #1250910
    Victoria

    Hi uribinsted,

    Please remove the code and let us help you with that.

    Best regards,
    Victoria

    October 6, 2020 at 7:26 pm #1250917
    uribinsted

    Hi Victoria,
    Thank you for your response, the code has been removed.
    Cheers,
    Uri

    October 6, 2020 at 9:42 pm #1250981
    Victoria

    Hi Uri,

    Here is the code you can put in Enfold > General Styling > Quick Css,  if it does not work, put into themes/enfold/css/custom.css

    
/* full_slider_1  */
@media only screen and (max-width:767px){
  #full_slider_1, 
  #full_slider_1 .av_slideshow_full.avia-slideshow,
  #full_slider_1  .avia-slideshow-inner,
  #full_slider_1 .avia-slideshow li,
  #full_slider_1 .avia-slideshow li img {
    min-height: 240px;


  }
  #full_slider_1 .avia-slideshow li img {
    width: 120% !important;
    max-width: auto;
  }
   .html_header_transparency #top .avia-builder-el-0 .slideshow_caption {
      padding-top: 0px;
  }
}

    If you need further assistance please let us know.

    Best regards,
    Victoria

    November 22, 2020 at 12:14 pm #1262088
    uribinsted

    Hi Victoria,
    I implemented the code and it works good, but there is anew problem that in the mobile resolution it distorts the image.
    Can the image be cropped in the middle so it is not distorted ?

    November 23, 2020 at 10:06 pm #1262487
    Victoria

    Hi uribinsted,

    You can try to change the width value here to find the one that fits you:

    
  #full_slider_1 .avia-slideshow li img {
    width: 120% !important;
    max-width: auto;
  }

    If you need further assistance please let us know.
    Best regards,
    Victoria

    November 24, 2020 at 3:09 pm #1262693
    uribinsted

    Hi Victoria,
    I tried various values from 80% – 300%
    and it seems to display maximum 100%.

    What I probably need is for mobile version image to be cropped

    November 25, 2020 at 12:18 am #1262851
    Victoria

    Hi uribinsted,

    You can build another slider with small images just to show on mobile in portrait mode. And hide the other slider with the Responsive settings for the slider.
    Image 2020-11-25 at 00.18.14.png

    Best regards,
    Victoria

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