Image Helper
Adds helper classes based image orientation and size relative to its container then centers the images.
Arguments
img
Element selector for the images. Must be a descendent of a
container
container
Element selector for the images layout ancestor.
Usage
The following example centers images within an instance of slider.
require ['lib/utils/image_helper', 'lib/components/slider'], (ImageHelper, Slider) ->
slider = new Slider(
el: '#js-slider'
)
imageHelper = new ImageHelper(
img: '.slider__img'
container: '.slider'
)
<div class="slider" id="js-slider" style="width: 400px; height: 240px;">
<div class="slider__slide js-slide">
<img class="slider__img" src="..." alt="..." width="640" height="480" />
</div>
<div class="slider__slide js-slide">
<img class="slider__img" src="..." alt="..." width="480" height="640" />
</div>
<div class="slider__slide js-slide">
<img class="slider__img" src="..." alt="..." width="640" height="640" />
</div>
</div>