How can i make the sliderpicture responsive. Now the background picture of the slide do shrink on the phone modus, see subvision.be
How can i make the sliderpicture responsive. Now the background picture of the slide do shrink on the phone modus, see subvision.beHi,
The behaviour of the background image is the same no matter where it is used (Slider, Section, etc). This behavior is defined by CSS specification.
So, the bg image resizes depending on the size of the control to which it was added. The type of the resizing depends on the chosen size option: cover, contain, 100% 100%, etc. In any case, the size of the bg image does not affect the size of its container - the Slide, in our case.
The Slide is regular <div> which behavior is defined by CSS specification too. It has 100% width of its parent and height which depends on the content inside or some fixed value. The elements inside Slide are positioned using absolute positioning (so you can move them). Therefore the Slider height may be fixed only. Otherwise it will be collapsed.
Unfortunately you cannot resize Slide with background image in the same way as regular html image can be resized.
The only option is to locate the Image control inside Slide, changing its positioning to relative and removing the fixed Slider height. In this case image may resize the Slide.
Thank you,
Olivia
Hi,
Let us know if you need our further help.
Sincerely,
Hella
sorry to inform that the solution don't give a good result
sorry to inform that the solution don't give a good resultThis is a feature I sincerely hope they add. Many many slideshows do not work as background images. There must be a way to use an image that will resize responsively like other CMS sliders.
The background image method does not work for all purposes. If you want to display a product for example it cannot get cut off or smushed and stretched out. It needs to stay uniform throughout all screen sizes.
I am glad others are noticing this and asking for changes.
This is a feature I sincerely hope they add. Many many slideshows do not work as background images. There must be a way to use an image that will resize responsively like other CMS sliders. The background image method does not work for all purposes. If you want to display a product for example it cannot get cut off or smushed and stretched out. It needs to stay uniform throughout all screen sizes. I am glad others are noticing this and asking for changes.Good and important idea, also I am still waiting for the ken burns effect I told them some time ago...
Good and important idea, also I am still waiting for the ken burns effect I told them some time ago...Hello Kris,
please submit new private topic where provide access to the WP admin back end. We'll check the issue with your theme.
regards,
Aileen
It could be possible to make custom CSS3 effects, but images are CSS background images and it makes it difficult. (Animations and effects are applied on all containers and text inside slider too)
I dont know if there is anything to do about it. It is the way Bootstrap carousel works. I would not like they change to much native Bootstrap part. There are plugins anyway for it.
It could be possible to make custom CSS3 effects, but images are CSS background images and it makes it difficult. (Animations and effects are applied on all containers and text inside slider too) I dont know if there is anything to do about it. It is the way Bootstrap carousel works. I would not like they change to much native Bootstrap part. There are plugins anyway for it.Aileen for this site i make the slider invisible in the phone modus, but however i want to know how i make the pictures in the slider responsive for the future.
Aileen for this site i make the slider invisible in the phone modus, but however i want to know how i make the pictures in the slider responsive for the future.It could be possible to make custom CSS3 effects, but images are CSS background images and it makes it difficult. (Animations and effects are applied on all containers and text inside slider too)
I dont know if there is anything to do about it. It is the way Bootstrap carousel works. I would not like they change to much native Bootstrap part. There are plugins anyway for it.
Not in a HTML5 site there really aren't.
> It could be possible to make custom CSS3 effects, but images are CSS background images and it makes it difficult. (Animations and effects are applied on all containers and text inside slider too) > > I dont know if there is anything to do about it. It is the way Bootstrap carousel works. I would not like they change to much native Bootstrap part. There are plugins anyway for it. Not in a HTML5 site there really aren't.Hello Kris,
you may try:
1.in Desktop mode set Slider image size to Wide (100% auto) and no-repeat
2.then switch to Phone mode and adapt the Slider Height to Phone screen size, e.g.
regards,
Aileen
