CheckerLight

Описание

jQuery плагин создающий визуальные эффекты перелива изображений в галереях или блочных элементов. Сначала демонстрация возможностей плагина:

typeAnimateion: random typeAnimateion: order typeAnimateion: linear typeAnimateion: linear typeAnimateion: linear

Установка

Подключаем js-файлы в head.

<script src="jquery-1.7.1.min.js"></script>
<script src="jquery.timers.js"></script>
<script src="jquery.checkerlight.js"></script>

и добавить стиль:

.b-checker {
    display: block;
    float: left;
    margin: 5px;
    width: 150px;
    height: 75px;
    background: #FFF;
}
.b-checker img {
    width: 100%;
}

Параметры

countCols: 7                //    количество колонок в галереи (обязательный параметр)
timeRepeat: 3000            //    время повторения анимации (мс)
timeShow: 300                //    длительность показа прозрачности (мс)
timeLight: 100                //    длительность удержания прозрачности (мс)
timeHide: 300                //    длительность скрытия прозрачности (мс)
opacity: 0.4                //    степень прозрачности (0-1)
innerTag: 'img'            //    название дочернего тэга который будет скрываться
countImgLight: 5            //    количество изображений используемых в анимации (при typeAnimation 'random')
delayImgLight: 200            //    временная задержка между показами изображений (мс)
typeAnimation: 'linear'    //    тип анимации. Может принимать значения: 'linear' - бегущая линия, 'random' - подсветка случайных изображений (в параметре countImgLight устанавливается их количество), 'order' - подсветка с первого по последние изображения (по умолчанию 'linear')
direction: 'left top'        //    направление анимации (только для типа 'linear'). Может быть 'top', 'left', 'left top' (по умолчанию 'left top')