Responsive sliders

red_ice

Hi!

I'm a big fan of zurb's Foundation framework and they have an addon called 'orbit' slider.

This slider works great, but I have one reservation about it. It can handle content for sliding, or it can handle images, but it cannot seem to do both!

There are examples it working how I want it to work, but this image is a standard background for anything that has conent on it, and this image cannot be changed when a new slide comes in.

I've looked at royal slider, and that seems to be exactly what I'm looking for, but it's not responsive.

Twitter Bootstrap have a great slider also, but the one problem with this one is that it kicks into smaller heights rather than resizing into them. This means that the image is not sitting correctly, and the aspect ratio of the image is completely distorted due to its fixed height. If you make the page thinner via a desktop web browser, the image (16:9 screen) starts off at about width 150%, and ends up at 10%, while the height of the image stays the same.

Has anyone got a recommendation for a good slider?

I have used 'responsive slider' before, and its amazing at what it does, but it doesn't include content, it only does images.

Cheers

ivanc

red_ice wrote: »

Hi!

It can handle content for sliding, or it can handle images, but it cannot seem to do both!

Does the content (text I assume) need to be separate from the image file?

Could you not just lay it on top of the image?

red_ice

ivanc wrote: »

Does the content (text I assume) need to be separate from the image file?

Could you not just lay it on top of the image?

Yea, I could put the text into the image, but for SEO/updating that text, I would much rather have it as html layered on top of an image.

or

Do you mean, have a background image with text on top? Which is exactly what I'm trying to achieve! Just like this, but the problem with that slider is when you scale the page, the image distorts, which wont do!

KonFusion

For images flexislider is pretty good. You might be able to adjust it yourself to add content.

You might even be able to adapt http://slidesjs.com/ to suit your needs.

Sorry I can't be of more help, but the bootstrap slider is what I've used in the past and I'm not sure I understand your problem.

What's the problem with the bootstrap slider in tweaking the css and removing the fixed height?

ivanc

red_ice wrote: »

Yea, I could put the text into the image, but for SEO/updating that text, I would much rather have it as html layered on top of an image.

Agree, it's a nicer solution to have them as separate entities.

That said image title and "alt" should still perform well for SEO.

smcelhinney

Eh.. Royal slider IS responsive? I've used several implementations of it on mobile/PC websites, never had to do more than a little customisation. Supports touch events out of the box.

I can give you help if you need? I personally love the Royal Slider plugin.

red_ice

smcelhinney wrote: »

Eh.. Royal slider IS responsive? I've used several implementations of it on mobile/PC websites, never had to do more than a little customisation. Supports touch events out of the box.

I can give you help if you need? I personally love the Royal Slider plugin.

Any chance you could link me to some sites you've used it on? Even via PM? My client is happy with static images and text, but if your site can do what I'm looking for I'll definitely use it!

smcelhinney

red_ice wrote: »

Any chance you could link me to some sites you've used it on? Even via PM? My client is happy with static images and text, but if your site can do what I'm looking for I'll definitely use it!

Actually launching a site this week with it, so I'll send you the link once that's live. Sorry, cant go into the public domain beforehand ;-)