Slider responsive question- wordpress

jurjen
115 Posts
jurjen posted this 05 August 2015

Maybe it is already asked, but I could not find it on the website but I would like to do the following.

I would like to add a slider that does not have a fixed hight, but a fixes width (100%)

The slides I would like to be images (all of the same size)

The images have to resize with the width of the page.

Is this possible?

Regards
Jurjen

Maybe it is already asked, but I could not find it on the website but I would like to do the following. I would like to add a slider that does not have a fixed hight, but a fixes width (100%) The slides I would like to be images (all of the same size) The images have to resize with the width of the page. Is this possible? Regards Jurjen

Last edited 19 May 2016 by Support Team

Vote to pay developers attention to this features or issue.
11 Comments
Order By: Standard | Newest
Stagger Lee
1840 Posts
Stagger Lee posted this 06 August 2015

Lenght = Full background.
Width = 100%.

Lenght = Full background. Width = 100%.
jurjen
115 Posts
jurjen posted this 10 August 2015

I am sorry, but I do not seem to get it working.

If I do the following:

Insert a slider and put it on Length full background
I then insert an image into a slide and put it on width 100%

I do not get to see the picture. The only way I am able to get the slide is with a fixed height.

If you go to www.vakapart.nl, you will see a slider on top. I would like to create the same in themler.

Regards
Jurjen

I am sorry, but I do not seem to get it working. If I do the following: Insert a slider and put it on Length full background I then insert an image into a slide and put it on width 100% I do not get to see the picture. The only way I am able to get the slide is with a fixed height. If you go to www.vakapart.nl, you will see a slider on top. I would like to create the same in themler. Regards Jurjen
brian18
4 Posts
brian18 posted this 11 August 2015

The slider is only responsive in terms of width, but has a fixed height with no way to change that I could find.

Is there any way to get the height to simply be determined by the contents.

Fixed height is fine for abstract images, but if the image contains text or faces or anything else that can't be cropped without looking broken, then a fixed height leads to top+bottom being chopped off (potentially chopping off text or half a face etc) on wide screens, or a blank background appearing top+bottom on narrow screens.

The slider is only responsive in terms of width, but has a fixed height with no way to change that I could find. Is there any way to get the height to simply be determined by the contents. Fixed height is fine for abstract images, but if the image contains text or faces or anything else that can't be cropped without looking broken, then a fixed height leads to top+bottom being chopped off (potentially chopping off text or half a face etc) on wide screens, or a blank background appearing top+bottom on narrow screens.
jurjen
115 Posts
jurjen posted this 11 August 2015

I agree with Brian18. I have spend a great amount of time to make something that looks like what I want, by setting different heights for the 4 screen sizes, but it is far from ideal.

With the bootstrap carousel as a basic it is easy to write your own DIV based slider that scales based upon the pictures.

I think that some of the functionality as it is programmed now, is to complex. I think this is due to the framework used so you can also put products in the slider with magento and woo commerce (not tested yet).

Maybe an option so you could just use images and no text or other elements as a slider would make it easy?

Regards
Jurjen

I agree with Brian18. I have spend a great amount of time to make something that looks like what I want, by setting different heights for the 4 screen sizes, but it is far from ideal. With the bootstrap carousel as a basic it is easy to write your own DIV based slider that scales based upon the pictures. I think that some of the functionality as it is programmed now, is to complex. I think this is due to the framework used so you can also put products in the slider with magento and woo commerce (not tested yet). Maybe an option so you could just use images and no text or other elements as a slider would make it easy? Regards Jurjen
Stagger Lee
1840 Posts
Stagger Lee posted this 11 August 2015

Slider follows what you input in image settings - Size. You need to know some CSS2, CSS3.
I just tested again on Cloud and it is not fixed height in small devices. It adapts to screen size and reduces in height.

Maybe you found some bug in generated theme, but on all my themes it behaves well.

That what Brian wants goes against physics. Of course you will have chopped faces and parts of images on small screens. Or distorted, depending on image settings.
This is adaptive web images he wants, not responsive. (Separate image sizes generate, sent, for separate devices)
And no theme around, I am aware, takes care of adaptive. There are several plugins for this.

Slider follows what you input in image settings - Size. You need to know some CSS2, CSS3. I just tested again on Cloud and it is not fixed height in small devices. It adapts to screen size and reduces in height. Maybe you found some bug in generated theme, but on all my themes it behaves well. That what Brian wants goes against physics. Of course you will have chopped faces and parts of images on small screens. Or distorted, depending on image settings. This is adaptive web images he wants, not responsive. (Separate image sizes generate, sent, for separate devices) And no theme around, I am aware, takes care of adaptive. There are several plugins for this.

Last edited 11 August 2015 by Stagger Lee

Stagger Lee
1840 Posts
Stagger Lee posted this 11 August 2015

Even with adaptive web images you have to crop and cut parts of your images. It is not at all easy as Brian imagine.
Specielly when you are dealing with background full screen sliders.

Just when we run away from IE6, IE7 nightmare it comes responsive web. But OK, that is why it is still expensive to hire webdesign company.

Even with adaptive web images you have to crop and cut parts of your images. It is not at all easy as Brian imagine. Specielly when you are dealing with background full screen sliders. Just when we run away from IE6, IE7 nightmare it comes responsive web. But OK, that is why it is still expensive to hire webdesign company.
Support Team
Support Team posted this 13 August 2015

Hello guys,
just a note: in fact you're all correct. The slider image may set to auto height and 100% width but it won't look ideal on some screen sizes. So the optimal workaround is to specify different image sizes for different screen sizes.

regards,
Aileen

Hello guys, just a note: in fact you're all correct. The slider image may set to auto height and 100% width but it won't look ideal on some screen sizes. So the optimal workaround is to specify different image sizes for different screen sizes. regards, Aileen
shivasafaiem
3 Posts
shivasafaiem posted this 04 January 2016

i am just curious how to get it working like http://www.porsche.com/uk/

i have tried for hours now, no idea whats going wrong

i am just curious how to get it working like http://www.porsche.com/uk/ i have tried for hours now, no idea whats going wrong
tmgarrison
51 Posts
tmgarrison posted this 12 May 2016

I wasn't able to get the slider to work - at all - in anything but smaller than a tablet. And even the tablet won't display the animations. I simply changes, no animation, to the next slide.
Has the latest version done away with the ability to work on other devices?

I wasn't able to get the slider to work - at all - in anything but smaller than a tablet. And even the tablet won't display the animations. I simply changes, no animation, to the next slide. Has the latest version done away with the ability to work on other devices?
Support Team
Support Team posted this 19 May 2016

Hi,

Ерыш slider has a script that automatically change the height of the Slider. Themler Slider does not support such feature. You can change the height of the Slider manually for each responsive mode, show or hide desired images and blocks.

If you have some specific questions please let us know.

Thank you,
Olivia

Hi, Ерыш slider has a script that automatically change the height of the Slider. Themler Slider does not support such feature. You can change the height of the Slider manually for each responsive mode, show or hide desired images and blocks. If you have some specific questions please let us know. Thank you, Olivia
DaveOzric
736 Posts
DaveOzric posted this 19 October 2016

I have added a topic, so please vote on a solution.
http://answers.themler.com/questions/104260/responsive-images-on-slider-please-vote

I have added a topic, so please vote on a solution. http://answers.themler.com/questions/104260/responsive-images-on-slider-please-vote
You must log in or register to leave comments