Проблема
Макет я сверстал на ZurbFoundation 5 и думал, что осталось только натянуть верстку на Laravel. Ну а для начала я хотел сделать сайт на MODX Revolution как тестовой платформе. Тем более, что буквально на днях вышла финальная версия 2.3 и мне хотелось её посмотреть.
К слову сказать, мне новая версия понравилась и не понравилась. Однако по ощущения мне хотелось сравнить её с версией 2.1.15 да на «боевом» хостинге. К удивлению, скорость примерно одинаковая. Вот только даже на «свистке» от BeLine на шаред-хостинге от Sprinthost.ru я спокойно уже мог работать. Да, админка тормозит по сравнению с MODX Evolution, но уже не бесит ожиданием и можно работать.
Так что шаблон я натянул и даже сделал структуру, меню и начал подбираться к галереи. В Ево я легко мог подключить как evoGallery, так и MultiTV в качестве галереи. А вот с Рево я разбирался впервые. Галерея Gallery очень похожа на evoGallery, однако её так же не слишком удобно использовать в простых случаях — трудно описать как добавлять фотографии и почему они будут отображаться именно на этой странице. Я решил остановиться пока на Gallery, а с другими решениями разобраться чуток позже. Все эти изыскания заняли у меня пару дней.
Но споткнулся я на подключении FancyBox в качестве всплывающего лайтбокса для картинок.
Первое, что получилось — это картинка выходила вправо-вниз за границы всплывающего окошка и неправильно позиционировался крестик закрытия.
Вторая сложность — при нажатии на картинку страница прокручивалась вверх.
А отказаться от галереи не мог, поскольку на главной странице крутились отзывы, скрипт которой, как оказалось, использовал функции из fancybox в качестве библиотек с красивостями.
Косяк со стилями
Если с первой напастью было понятно как бороться: залазить в стили и править, то со второй пока решил обождать.
Гугление выяснило проблему позиционирования еще с версии Foundation 3 из-за конфликтов со стилями. Предлагалось обновление на более поздние версии. Обновление версии на последнюю в ветке 1 версии 1.3.4 не помогал. А вот в ветке 2 уже косяк был поправлен. Ну хоть с этим не копаться самостоятельно.
Позиционирование на странице
Прокрутка вверх странице при вызове скрипта оставалась и нагуглить решение на русском и английском мне не удавалось. Выскакивало куча мусорных страниц с форумов и блогов, в которых обсуждалось что угодно, но не решение этой проблемы.
Но вот когда я совсем отчаялся побороть эту напасть, я решил поискать ответы на английском «fancybox scroll top». И решение было тут же найдено!
Оказалось, что в тегах html или body со свойством height:100% и дает этот глюк в отображении. Проблему уже нашли и пофиксили. Вот только в официальном репозитории еще старая версия лежит.
А ссылка дала архив на с гитхаба версии 2.1.5, где уже проблему решили. И есть решение с хелпером:
$('.image').fancybox({ padding: 0, helpers: { overlay: { locked: false } } });
но я его не тестил, поскольку мне и первое решение помогло.
Мораль проста: «Никогда не сдавайся!».
Ну а второй вывод: не нашел на русском, ищи на английском, ищи синонимы — кто-нибудь уже наступал на грабли и писал свое решение.
