Вот пример того, что я имею в виду, эта ручка создана, чтобы изолировать обнаруженную ошибку, и я нахожусь после любых решений, чтобы она работала в Safari так же, как вы видите в Chrome, Firefox или Edge.
https://codepen.io/kylewetton/pen/rNOOXBg
(пожалуйста, попробуйте это как в Safari, так и в Chrome / Firefox / Edge, чтобы увидеть разницу)
Нажмите и перетащите по окну, и мяч будет следовать за вашим курсором.
...
document.addEventListener('mousemove', ev => {
let x = ev.clientX;
let y = ev.clientY;
active && move(x, y);
});
function move(x, y) {
ball.style.left = `${x - 25}px`;
ball.style.top = `${y - 25}px`;
};
Вот здесь и возникает проблема. Существует свойство перехода CSS на шаре, которое позволяет ему плавно скользить к курсору, даже при том, что top и left постоянно обновляются. Кажется, что это правильно рассчитывается во всех браузерах, но Safari не может с этим справиться.
#ball {
....
transition: 0.2s ease-out;
}
У кого-нибудь есть какие-либо предложения для меня?