Slider image is cropped in mobile view, but visible in desktop view.

This topic has 9 replies, 3 voices, and was last updated 1 years, 11 months ago ago by Rose Tyler

  • Avatar: Saira
    Saira
    Participant
    July 4, 2022 at 07:24

    Slider image is cropped in mobile view, but visible in desktop view. How can I adjust the image in mobile view only.
    https://snipboard.io/psDUnI.jpg

    8 Answers
    Avatar: Rose Tyler
    Rose Tyler
    Support staff
    July 4, 2022 at 07:42
    Avatar: Awais Ahmed
    Awais Ahmed
    Participant
    July 4, 2022 at 07:46

    Hello, @Saira,

    If you use the image as the BG image for the slider + background-size “cover” you need to understand that image will be cropped on different devices because background-size “cover” works in this way https://cssreference.io/property/background-size/

    You are using Slider Revolution on your site, so you have to go to Slider Revolution and edit the particular slider and then you have to go to Slide Option and under it change the BG fit as per your requirements: https://postimg.cc/TyqDpxF2

    Regards 8Themes Team.

    Avatar: Saira
    Saira
    Participant
    July 4, 2022 at 07:56

    Hi,
    On changing this option for mobile view, the desktop view is also changing and the background image is changing. How can I set the option only for mobile view.

    Avatar: Awais Ahmed
    Awais Ahmed
    Participant
    July 4, 2022 at 08:36

    Hello, @Saira,

    You can set an option for each layout in the slider revolution plugin settings. Here is complete documentation for it: https://www.sliderrevolution.com/documentation/responsive-settings/ also here is the detailed video for a better reference to understand: https://www.youtube.com/watch?v=IPaUF8UEdz8&t=173s

    Regards 8Themes Team.

    Avatar: Saira
    Saira
    Participant
    July 8, 2022 at 09:54

    When I switch from Desktop to Mobile view, I can see the grid layer (the small blue dots) becoming smaller and the background image being cropped. Except that the grid layer I get doesn’t focus on the part of the background image I want. How can I make the image centred or without getting cropped.
    https://snipboard.io/cW0N9X.jpg

    Avatar: Awais Ahmed
    Awais Ahmed
    Participant
    July 9, 2022 at 06:58

    Hello, @Saira,

    To show the background image without cropping and appear center. Always set the background image to contain not cover. As you can see in the screenshot: https://postimg.cc/N9gY5dG0 there is an option to set the background to contain.
    Simply set it and then check the results I hope your issue will be resolved.

    Regards 8Themes Team.

    Avatar: Saira
    Saira
    Participant
    July 11, 2022 at 06:39

    On setting this option, white space is appearing on top and bottom of the slider.
    https://snipboard.io/541tRQ.jpg

    Avatar: Rose Tyler
    Rose Tyler
    Support staff
    July 11, 2022 at 14:00

    Hello,

    Yes, because you need to change size of the slider for mobile – https://prnt.sc/XmCNHUVTFg0e

    Regards

  • Viewing 9 results - 1 through 9 (of 9 total)

You must be logged in to reply to this topic.Log in/Sign up

We're using our own and third-party cookies to improve your experience and our website. Keep on browsing to accept our cookie policy.