мобильное сафари 5 не отвечает на события JS до дальнейшего актона

Question

Итак, проверьте http://www.toyota.ca/toyota/en/vehicles/yaris-hatchback/gallery, используя ios 5 / mobile safari 5 или симулятор, нажмите изображение на скроллере внизу, и появится лайтбокс. Попробуйте нажать следующую кнопку, вы заметили, что ничего не происходит. Теперь, если вы увеличите или уменьшите масштаб, измените ориентацию или прокрутите страницу, изображение изменится.

JS работает, потому что следующий / предыдущий будет включен / отключен, когда вы нажимаете их, но он не выполняет анимационную часть до дальнейшего действия. Почему это? это распространено? Если вы попробуете ту же страницу на ios 4, она будет работать нормально.

Answer 1

Не используйте обработчик click(), используйте обработчик mousedown().

Мобильным устройствам трудно различать click() и mousedown().

Необходимое изменение - строка 472 в common.js, изменение

var o=p(f,c.prev).click(function(){b.prev()}),q=p(f,c.next).click(function(){b.next()});

на

var o=p(f,c.prev).mousedown(function(){b.prev()}),q=p(f,c.next).mousedown(function(){b.next()});

Либо то, либо, для каждоготакую ​​кнопку навигации при создании используйте:

 $(selector).bind('mousedown',$(selector).data("events").click[0].handler)
 $(selector).unbind('click',$(selector).data("events").click[0])

Где selector - селектор jQuery для конкретного элемента.

Или вы можете просто использовать $(class).off, чтобы очистить обработчик раз и навсегда.