Приложение для мобильного браузера

[poorking]

Здравствуйте, я собираюсь написать приложение под кпк, скажите на что следует обратить внимание? Что не будет работать? Знаю что это тоже зависит от браузера, но если есть более конкретная информация, прошу поделиться, самыми важными моментами. Интересуют самые популярные браузеры под мобильные оси, маленькая опера, сафари и хромиум (или какие там в iOS и Android). У самого есть только Opera Mini под обычным телефоном, так что попробовать все нет возможности к сожалению. На самом деле больше всего интересует динамическое изменение страницы, слышал что она в опере (под Windows Mobile) например, будто бы перезагружается. Спасибо.

[Magneto]

На сайте Opera можно скачать эмулятор Opera Mobile, эмулятор Windows Phone 7 (там есть мобильный IE) входит в бесплатную Windows Phone Developer Tools, в новых Iphone используется практически полноценный Safari (чем очень гордится Apple) ну и наверняка есть эмуляторы для андроида.

[poorking]

Спасибо, уже скачиваю андроид SDK, сейчас и все остальное скачаю, про сафари здорово, тогда смотреть в ней не буду даже

[da_ff]

Смотреть придется и в айфон, модильные платформы имеют свою специфику.
Многие css свойства ведут себя не так как ожидается. Например, position:fixed ведет себя как position:absolute, нельзя создать блок фиксированной высоты со скролом, в айфонах iframe при height:auto имеет предел высоты, дальше которой он обрезате контент, анимацию имеет смысл делать только через css transform, иначе будут вырвиглазные тормоза. Есть проблелмы с svg, на андроидах старых нет анимации в гифках. Опять же на андроидах есть проблемы со скруглением углов через css. Вообщем, хватает своих изъебов.

[ASerputko]

1. Верстка: как уже сказал da_ff, в разных моб. дивайсах верстка ведет себя по разному, в браузере на ПС может быть все идеально, а вот на мобилках - то высота контейнера не определилась, то стиль не корректно работает. К примеру если у тебя все ок смотрится на ipode, то на андроеде может быть все .... просто жесть.
2. Верстка2: Телефон можно держать как горизонтально, так и вертикально. В обоих положениях верстка будет отличатся. Я использовал в некоторых моментах Еvent orientationchange - реагирует на повороты.
3.EVENTS.Если на компе работают mouse - события, то на мобилках touch - события. mousedown = touchstart, mousemove = touchmove, mouseup = touchend.
4. Разработка приложения естественно идет на PC, потому будешь использовать mouse события, но на мобилках они не покатят, нужно знать когда ты на PC, а когда на дивайсе. Я использовал такой хак

return 'ontouchstart' in window

. На дивайсе вернет true, на PC - false. Ну соответственно будешь подключать нужные события.

[x-yuri]

Я использовал такой хак
return 'ontouchstart' in window

прикольно, feature detection оказывается хак

[melky]

забыли про анимации!!

не используйте яваскрипт для анимаций : он там до ужаса тормозит ( я проверял )

а вот переходы не тормозят (это не проверял пока)

[da_ff]

return 'ontouchstart' in window

Обычно это делается как

touchStartEvent =  $.support.touch ? 'touchstart' : 'mousedown'
touchStopEvent =  $.support.touch ? 'touchend' : 'mouseup'

Ну и

$o.bind(touchStartEvent, callback);

[ASerputko]

da_ff

$.support.touch - на андроиде тоже возвращает true?

[poorking]

ASerputko,
touchstart - mousedown
touchend - mouseup
touchmove - mousemove

а click? Тоже touchstart?