Плагин liCover подгоняет изображение под размеры родительского элемента, не искажая его пропорций. При этом изображение всегда будет занимать всю площадь родительского элемента.

liCover максимально упрощает выполнение таких задач как:
- фон на весь экран
- фотографии нестандартных пропорций

Очень прост в подключении и весит всего 2kb

Пример работы на JSFIDDLE

Подключаемые файлы

<link rel="stylesheet" href="#">
<script src="/px.png"></script>
<script src="/js/jquery.liCover.js"></script>

Структура HTML

Вставляем в HTML изображение и присваиваем ему произвольный класс

    <img class="cover" src="/pic/image.jpg">

Инициализация плагина

Остается только скормить плагину "liCover" нашу картинку. Так как работаем с изображением и обязаны дождаться его полной загрузки, то делаем это через событие "$(window).load()"

  $(window).load(function(){
    $('.cover').liCover({
      parent: $(window),
      position:'absolute',
      veticalAlign:'middle',
      align:'center'
    })
  })

Параметры

События

Перерисовка изображения висит на стандартном событии объекта $(window) "resize", также можно использовать пользовательское событие "redraw"

пример кода

  $(window).trigger('redraw')

  

Bug Fix