Slider.js: Slideshows with jQuery, CSS Transitions and Canvas

[gren]

http://greweb.fr/slider/

[spython]

His flexible-nav jquery library he is using on the demo page looks actually more interesting than the slider.js itself - http://demo.greweb.fr/flexible-nav/

[hmigneron → spython]

Reminded me of the navigation on a javascript documentation website posted a little while ago : http://bonsaiden.github.com/JavaScript-Garden/

I am seeing more and more of these all over the place and I think they are great for long pages! Would love to see more of them instead of table of contents on documentation websites (for example, using something similar on a site like the HTML5 spec : http://www.w3.org/TR/html5/ would make the navigation a lot more efficient)

[castewart → spython]

Agreed! Was more impressed with the nav, but that's probably because I'm on old hardware/slow connection so the slideshow was very sluggish for me.

[hackDaily]

Very nice! There are a lot of rotator plugins out there, but yours seems very complete and robust. I will definitely be using this in future projects since our clients always want more fancy sliders. Thanks again!

[brlewis → hackDaily]

What business are your clients in? I tend to think of slideshow transitions as something users find enjoyable only for a very short time. (I run a photosharing site -- http://ourdoings.com/ -- where I recently redid the slideshow to use photoswipe, which works well on touch devices but does not do fancy transitions.)

[hackDaily → brlewis]

Our clients are typically churches and small business who like to have banners on their home pages. There's always something "featured" that they want to show off.

[brlewis → hackDaily]

That use case makes sense to me -- a quick attention-getter.

[xbryanx]

Bummer, the images display not at all with JavaScript turned off and there's no way to link to a specific image. Degrade gracefully y'all.

[jmilloy → xbryanx]

Perhaps it's the responsibility of each website using slider.js to degrade gracefully on their own. That seems more appropriate to me. In which case, I don't mind if they don't bother to degrade while demoing their javascript product.

[wavephorm → xbryanx]

Are you really demanding that the author of an open source javascript project to supply non-javascript code to make your website backwards compatible? You've gotta be kidding me.

That's not his responsibilty at all. Try contributing to an open source project instead of complaining.

[xbryanx → wavephorm]

Yep, I absolutely expect that. Especially on the example page.

[gren → xbryanx]

Problem solved:

It's very easy to handle a Javascript fallback for Slider.js: Instead of having an empty container in which your slider will be templated, put the content for the non-javascript into it.

That's it ;) Just because the Slider Javascript will empty the content of it ;)

(Side thought: maybe I'm wrong, but in 2011, are we still need a JS backwards?)

[wavephorm → xbryanx]

So now you have 2 problems:

1) Your website requires backwards compatibility

2) It's not his problem

Better whine and complain on the internet until someone fixes your problems for you.

[gee_totes → xbryanx]

Yeah, I can't even scroll the page on Chrome

[sudonim]

As a ux / design type person, I'm turned off by the design of the prev, next and slide selectors.

I know that's not the main purpose of the JS library, however, I'd spend a little time making it look pretty:

Here are some ideas: http://dribbble.com/search?q=slideshow

Great work though so far!

[gren → sudonim]

Thanks for your ideas! The slider engine is here, you are free to style it :)

[josscrowcroft]

This is just great, huge potential, looking forward to giving it a try. Congrats to author!