Is there an option where a background image will maintain its aspect ratio, and the container its in will grow in height as needed, in-turn pushing the content of the page down when needed allowing for the entire height of the image to be seen?
Currently the image backgrounds resize themselves within a fixed container, causing images that appear good at 1200px width, to be unusable when the viewport reaches 2600px wide because only something like 30% of the image would be visible. Does that make sense?
The behavior of the background image sizes can be controlled with the Slide Background Image -> Size option. You can choose from auto, cover, contain and stretch. These various settings will allow you to display the background image as you like it, you can even show the whole background image without changing the aspect ratio if you would like to.
Thank you for your reply but you didn't answer the question I asked, or maybe you did if you are saying its not possible.
If it's not possible, is there a recommended way for dealing with responsive sites, where the concern is the viewport width. background: cover gets problematic between widths of 1300px and 2600px for obvious reasons. Is there a way to use different images for different device widths? Will Layerslider let me do @media queries and srcset
The 'Auto' option in the 'Background Image' -> 'Size' setting will leave your image in its original size and aspect ratio. If you want to keep the image in its original form, you should use that option.
Since version 6 you have the option to display layers only on certain devices (desktop, mobile, tablet). This new feature gives you the option to create separate layers for mobile, tablet and desktop view in the same slide and only show them on the required device.
Is there an option where a background image will maintain its aspect ratio, and the container its in will grow in height as needed, in-turn pushing the content of the page down when needed allowing for the entire height of the image to be seen?
Currently the image backgrounds resize themselves within a fixed container, causing images that appear good at 1200px width, to be unusable when the viewport reaches 2600px wide because only something like 30% of the image would be visible. Does that make sense?
Hey Matthew,
The behavior of the background image sizes can be controlled with the Slide Background Image -> Size option. You can choose from auto, cover, contain and stretch. These various settings will allow you to display the background image as you like it, you can even show the whole background image without changing the aspect ratio if you would like to.
Thank you for your reply but you didn't answer the question I asked, or maybe you did if you are saying its not possible.
If it's not possible, is there a recommended way for dealing with responsive sites, where the concern is the viewport width. background: cover gets problematic between widths of 1300px and 2600px for obvious reasons. Is there a way to use different images for different device widths? Will Layerslider let me do @media queries and srcset
The 'Auto' option in the 'Background Image' -> 'Size' setting will leave your image in its original size and aspect ratio. If you want to keep the image in its original form, you should use that option.
Since version 6 you have the option to display layers only on certain devices (desktop, mobile, tablet).
This new feature gives you the option to create separate layers for mobile, tablet and desktop view in the same slide and only show them on the required device.