Building a responsive site is hard sometimes, particularly when you want to have a carousel on your page but the plugin you normally use does not have the ability to resize or recalculate when you resize your browser.

I would like to gather a collection of scripts/plugins/techniques to use when building a responsive site – things like carousels & image sliders – so that when I need a plugin for a particular purpose, I know which one has been user tested &, most importantly, vouched for.

Examples of the type of things I’m referring to could be: full-screen/full-width/fluid-width media (images, video), carousels, image sliders, image galleries, text resize/reflow, tabs, grid systems… you get the idea. These scripts should also have lean markup & good fallbacks should the not have javascript turned on.

Slideshow/Carousels

• 1. jQuery Slideshow
• 2. jQuery Cycle
• 3. Flex Slider

Frameworks/Boilerplates

• 1. Boost – my boilerplate framework which includes multiple css grids (1kb, Inuit etc) with responsive layouts
• 2. Skeleton framework – “A Beautiful Boilerplate for Responsive, Mobile-Friendly Development”
• 3. Bootstrap – Twitter’s toolkit
• 4. Less Framework – CSS grid framework
• 5. The Semantic Grid System – CSS grid using LESS
• 6. SimpleGrid

‘Media’ delivery

• 1. Sencha.io image delivery – resizes images on the fly depending on which device the user is using
• 2. Responsive Image – An Experiment with Mobile-First Images that Scale Responsively & Responsibly (info)

Browser compatibility

• 1. Respond.js – A fast & lightweight polyfill for min/max-width CSS3 Media Queries (for IE 6-8, and more)

Needs more work to be useful in a responsive layout:

• 1. Galleria – image gallery script

I need your help & input

In order for this to be of any use, I need your input. Please comment with any links or suggestions etc so that we can begin to collate