Я закрываю слайд -шоу со следующим кодом: < /p>
$(document).on('touchstart click', function(e) {
var hideX = $(".exit"),
$actSlide = $(".active-slide img"),
minusPlus = (Math.round(Math.random()) * 2 - 1),
angle = Math.floor(Math.random() * (360 - 180 + 1)) + 180,
xangle = angle*minusPlus;;
if ($container.is(e.target) || hideX.is(e.target)) {
$({deg: 0, scale: 1}).animate({deg: xangle, scale: 0}, {
step: function(now){
$actSlide.css({
transform: "rotate(" + now*xangle + "deg) scale(" + now + ")"
});
},
duration: 500,
easing: 'swing',
complete: destroyD(), //some function when the animation is completed
});
} //ende if target
});
< /code>
Это отлично работает на экранах настольных компьютеров (Chrome, Firefox, Safari на различных ОС). Несмотря на то, что тестирование на мобильных устройствах (в основном iPhone и iPad) я наблюдаю довольно озадачивающее поведение. Анимация начинается, а затем перезагружает параметры и перезагружается. Почему это? Есть ли что -то, что мне нужно добавить для мобильных устройств? Должен ли я очистить все анимации, прежде чем начать показанную выше? Я проанализировал HTML -элементы, а также любые вмешательство от других сценариев. Но с этих сторон все в порядке. Если у вас есть информация об этом, я буду рад услышать от вас. Спасибо
p.s.: Базис jquery 3.5.1
Подробнее здесь: https://stackoverflow.com/questions/797 ... -on-mobile