jquery-fillwidth-lite

Lines up a single row of images to fit their container. Like a simpler + dumber version of https://github.com/craigspaeth/jquery.fillwidth.


Example

```javascript
jqueryFillwidthLite($, _, imagesLoaded)
$('#el').fillwidthLite()
``

With more options

``javascript
var jqueryFillwidthLite = require('jquery-fillwidth-lite');
jqueryFillwidthLite($, _, imagesLoaded)
$('#el').fillwidthLite({

// What height you want to aim for the image to be
targetHeight: 500,

// By default this will just line the images up so they're
// squeezed together. You may want to do something different like
// add some margin in between them. This gives you a hook so you
// can access the img object that looks something like this:
// {
// $el: // The DOM element
// width: // The width the $el should be
// height: // The height the $el was calculated to be after fillwidth
// }
apply: function(img, i, gutterSize) {
img.$el.width(img.width).css({ 'margin-right': '15px' })
},

// If you're going to add gaps via margin or padding in apply be
// sure to specify how much per-image here.
gutterSize: 15,

// A callback for after the fillwidthing has finished
done: function() {

}
})
``

See example.html for a working example.

TODOs

* Better docs
* Host example on gh-pages
* Tests
* Remove underscore and imagesloaded dependencies. Maybe jQuery eventually.
* Refactor to plain Javascript source

If you are at all interested in using this plugin please leave an issue bugging me about it and I will get on these right away.

Contributing

Please fork the project, build the changes npm run build`, and submit a pull request.

License

MIT