Ответ 1
Я нашел несколько вещей в моих недавних начинаниях с iPad.
1 Версия 4.2 iOS имеет ошибку, в которой выполняется слишком много document.getElementById('foo'); приведет к задержке браузера и, следовательно, не будет корректно выполнять команды. Чтобы исправить это, вам нужно создать переменные для хранения этой информации и только сделать команды выбора, когда это необходимо. Версия 4.3 iOS исправляет это, хотя, как я протестировал его на своем iPad.
2: При работе с позиционированием я обнаружил, что при создании собственного видеоконтроллера (для html5), если вы попытаетесь изменить размер видеоконтента с помощью позиции: relative или position: absolute, вы больше не увидите видео, а красивый черный экран (со звуком!). Чтобы исправить это, просто настройте родительский фрейм, и вам хорошо идти.
3: Если вы используете iScroll, обязательно установите тайм-аут при загрузке; особенно если у вас есть несколько других javascripts на странице, так как даже если документ загружается, когда "страница загружена" через:
// Load iScroll when DOM content is ready.
document.addEventListener('DOMContentLoaded', loaded, false);
У меня это не получилось, и я не мог понять, почему мой div не правильно оценивает, показывая мне все элементы, но последние два, а не прокрутку. Вместо этого я просто сделал
$(function(){
//other page loaded items to do
//the iScroller init
setTimeout('iScrollerInit();',200);
});
и это очень быстро устранило проблему.
4: Если вы обнаружите, что ваши клики работают некорректно, я обнаружил, что многие из мобильных SDK там являются обязательными элементами во всем, что затрудняет достижение кликов к вещам как правило, вы хотите. Поэтому, чтобы исправить это, вы можете сделать что-то вроде:
$("#yourId").unbind("click").click(function(){
//what to do when clicked
});
и я нашел, что это работает наиболее блестяще.
**UPDATE - Nov 2012 **: It been a few years, and there is so much more to add to this so wanted to update the list a bit.
5: Javascript стоит дорого на нескольких устройствах STILL (декабрь 2012). Выполнение вещей, которые манипулируют DOM, создает значительную задержку на устройствах, и вы должны быть очень осторожны при выполнении этих действий. Вы захотите проверить свои мобильные веб-страницы как на старых устройствах Android, так и на старых устройствах iPhone, поскольку из наших показателей это все еще хорошо используемые устройства.
6: Если вы передаете HTML для загрузки в веб-представлении на устройстве (приложение для iPhone или приложение для Android), есть моменты, когда вы увидите почти высоту 0. Что вам нужно сделайте, чтобы ваше приложение iPhone или Android сделало вызов Javascript на фактической странице, нацеленной на div, чтобы проверить страницу offsetHeight, которая затем позволит точно настроить высоту веб-просмотра.
**UPDATE - Dec 2012 **: Few more awesome findings
7: Я обнаружил, что, когда вы настраиваете таргетинг на свои divs для событий кликов, мобильные браузеры будут ждать 300 мс перед запуском события, эффективно создавая отставание. Они делают это, чтобы подтвердить, что щелчок не был двойным нажатием. чтобы избежать этого, вы можете связать события touchhend, которые будут срабатывать мгновенно!
Здесь немного кода
$(document).ready(function() {
$('#element').bind('touchstart', function(event) {
event.stopPropagation();
event.preventDefault();
$(this).toggleClass('hover_heading');
});
$('#element').bind('touchend', function(event) {
event.preventDefault();
$(this).toggleClass('hover_heading');
});
});
Затем, когда вы видите, что мигание происходит над вашими объектами, используйте это, чтобы удалить это.
body * {
-webkit-tap-highlight-color: rgba(0,0,0,0);
}
Также, если вы хотите проверить выдающуюся статью, на которой написано google, вы можете просмотреть ее здесь: - Создание быстрых кнопок для мобильных веб-приложений
**UPDATE - Feb 2013 **: Few more awesome findings
8: при версировании ваших файлов CSS и кешировании их с помощью URL-адресов, таких как: mydomain.com/css/styles.css?v=123 (или что-то еще), будьте осторожны с устройствами Android 2.2 и раньше, поскольку это заставляет чрезвычайно странное поведение.
Из моих выводов андроид сделает это совершенно неправильным и заставит html даже запутаться. Лучший способ работы с этими более старыми устройствами, к сожалению, изменить фактическое имя файла.
Надеюсь, эти результаты помогут другим, поскольку я изо всех сил пытаюсь преодолеть каждую из этих проблем в течение нескольких часов, царапая мою голову:)