Javascript-форум (https://javascript.ru/forum/)
-   Мобильный JavaScript (https://javascript.ru/forum/mobile/)
-   -   Приложение для мобильного браузера (https://javascript.ru/forum/mobile/17108-prilozhenie-dlya-mobilnogo-brauzera.html)

poorking 06.05.2011 03:26

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

Magneto 06.05.2011 03:41

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

poorking 06.05.2011 03:49

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

da_ff 06.05.2011 13:32

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

ASerputko 08.05.2011 23:12

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 09.05.2011 04:09

Цитата:

Сообщение от ASerputko
Я использовал такой хак
return 'ontouchstart' in window

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

melky 09.05.2011 09:52

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

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

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

da_ff 16.05.2011 13:30

Цитата:

Сообщение от ASerputko (Сообщение 103884)
Я использовал такой хак
return 'ontouchstart' in window
. На дивайсе вернет true, на PC - false. Ну соответственно будешь подключать нужные события.

Обычно это делается как
touchStartEvent =  $.support.touch ? 'touchstart' : 'mousedown'
touchStopEvent =  $.support.touch ? 'touchend' : 'mouseup'


Ну и
$o.bind(touchStartEvent, callback);

ASerputko 17.05.2011 08:50

da_ff

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

poorking 17.05.2011 13:30

ASerputko,
touchstart - mousedown
touchend - mouseup
touchmove - mousemove

а click? Тоже touchstart?


Часовой пояс GMT +3, время: 22:15.