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>