Делаю сайт со слайдером, где используется transform для анимированного раскрытия карточек: сайт (самый первый слайдер). В safari на ios 9-10 есть проблема: карточки исчезают из-за свойства transform во время анимации, т.е. мигают. Сам слайдер использует тот же transform для прокрутки элементов-карточек. Добавление префиксов не помогло. Хочется найти самый консервативный вариант исправления подобной проблемы. Вот фрагмент кода из-за которого такое происходит:
.header__slider .glide__slide--active img,
.header__slider .glide__slide--active .controls button {
transform: translateX(-163px);
} .header__slider .glide__slide--active .controls button i {
transform: rotate(180deg);
}
.header__slider .glide__slide--active .text-box {
transform: translateX(255px);
}
.header__slider .glide__slide--active .border {
transform: translate(-153px, 10px);
width: 748px;
}
upd: дело оказалось исключительно в плагине-слайдере. Но всё равно хочется понять с технической точки зрения из-за чего такое получается, т.е. что может повлиять на рендеринг анимированного transform во время другой анимации(перемещение дорожки со слайдами). Плагин: glide.js.
Всё-таки дело было в префиксе: '-webkit-backface-visibility: hidden;' в стилях плагина у дорожки со слайдами это свойство было без префикса, а там происходила 3d трансформация, из-за которой "исчезала" моя, в старых версиях safari.
Виртуальный выделенный сервер (VDS) становится отличным выбором
Не соображу как при помощи Grid сделать список в строку (количество элементов LI неизвестно, генерируется автоматически)
Нужно при клике добавить рандомное число в таблицу,в следующем клике,надо этой числе добавить 1Надо при клике на другую клетку,добавить другое...
Как выполнить некий JS код, скажем alert() только после того как DOM загружен, $(document)ready(), $(window)