• FancyBox 1.3.4 - как устранить прыжки картинки по горизонтали?

    @Pribolshoy
    Сегодня тоже наткнулся на данную проблему. При увеличении и уменьшении изображения - оно скачет, увеличивается и сжимается в нужное положение.
    Покопавшись обнаружил, что вся движуха происходит в div с классом fancybox-content, в нем и находится изображение. При увеличении/уменьшении происходит подгон изображения под вычисляемый размер и на время данного процесса к этому div'у добавляется стиль transition-duration, который заставляет нас наблюдать этот "скачок".

    Решение: (проверено только на fancyBox v3.5.7)
    - Добавить к диву с картинкой следующий стиль. Это уберет ПОЛНОСТЬЮ анимацию увеличения/уменьшения
    .fancybox-slide--image .fancybox-content {
    transition-duration: 0s !important;
    }

    - Следующий стиль добавит анимацию движения ТОЛЬКО к увеличению/уменьшению картинки, а сам ее скачок обойдет (т.к .fancybox-is-scaling добавляется к родительскому элементу только на время увеличения/уменьшения)
    .fancybox-is-scaling .fancybox-content {
    transition-duration: 366ms !important;
    }
    Ответ написан
    Комментировать