четверг, 23 ноября 2017 г.

JQuery сниппет для прокрутки изображения относительно положения мыши

Этот сниппет позволяет прокручивать изображение в нужном вам контейнере относительно положения мыши внутри этого контейнера.

$("body").on("mouseout", ".image-zoom__paralax-layer", function() {
    $(this).find("img").css({ marginTop: 0 });
});

$("body").on("mousemove", ".image-zoom__paralax-layer", function(e){
    var img = $(this).find(".image-zoom__paralax-image"),
    thisHeight = $(this).height(),
    h = $(this).find("img").height(),
    offset = $(this).offset(),
    position = (e.pageY-offset.top)/$(this).height(),
    maxAvailable = h - thisHeight;

    h = h * position / 2;
    if (h < maxAvailable) {
        img.css({ marginTop: -h });
    }
});

Комментариев нет:

Отправить комментарий

Mysql настройка режима

Для настройки режима mysql не обязательно править конфиги можно выполнить команду mysql > set global sql_mode = 'STRICT_TRANS_TAB...