Блог HTML5 Desktop/Mobile — jQuery UI или jQuery Mobile?

Итак, я подумываю вернуться к разработке игр. И пытался вести небольшой блог. Давно хотел где-нибудь разместить несколько руководств по вещам, над которыми я работаю, помимо моей школьной работы. Я использовал blogger, но я вернулся к написанию сценариев и веб-разработке и хотел попытаться отойти и просто создать что-то минимальное на своем сервере. Я подсел на HTML5 и люблю использовать jQuery за простоту, которую он обеспечивает в моих сценариях. Однако я все еще новичок в веб-разработке в целом, так как большая часть того, чем я занимался в школе, связана исключительно с нативным программированием.

Я пытался сравнить библиотеку пользовательского интерфейса jQuery и jQuery Mobile. Меня интересует создание собственного блога с нуля. Ничего фантастического. Просто место для размещения учебников и тому подобное. Я уверен, что готов принять вызов. Насколько я понимаю, jQuery UI и jQuery Mobile — это две совершенно разные вещи. Помимо этого и того факта, что мне нравится тема, которую я смог создать для пользовательского интерфейса jQuery в приложении themeroller, я не слишком уверен.

Я хочу, чтобы мой блог хорошо выглядел и быстро работал на телефонах/планшетах. Даже на рабочем столе он будет очень минимальным. Было бы легко создать блог с помощью пользовательского интерфейса jQuery и иметь возможность легко масштабировать его для мобильных устройств? Или было бы лучше просто использовать jQuery для мобильных устройств как для телефонов/планшетов, так и для настольных компьютеров? так как я все равно хочу минимум? Могу ли я с помощью jQuery Mobile добиться таких же возможностей настройки и программирования, как с помощью пользовательского интерфейса jQuery?

Если кто-нибудь знает какие-либо хорошие решения, которые позволят мне масштабировать один и тот же макет как для рабочего стола, так и для мобильных устройств.


layout jquery blogs jquery-ui jquery-mobile
person Cory Gross    schedule 22.06.2012    source источник

Ответы (1)


arrow_upward
3
arrow_downward

И jQuery UI, и jQuery Mobile на самом деле имеют настройку темы.

Пользовательский интерфейс jQuery — http://jqueryui.com/themeroller/ jQuery Mobile — http://jquerymobile.com/themeroller/index.php

Что касается универсальности, это действительно зависит от вас, мобильные браузеры способны работать как с jQuery UI, так и с мобильными устройствами, так что в зависимости от того, что вам удобно и нравится на рабочем столе, а также.

Теперь, чтобы решить проблему размера макета:

Самый простой способ масштабировать один и тот же макет для настольных компьютеров и мобильных устройств — использовать гибкие макеты с шириной в процентах. Однако до мобильного размера он начинает довольно быстро перекашиваться.

Вместо того, чтобы использовать только проценты, я бы предложил использовать медиа-запросы. Это позволит вам изменять CSS по мере изменения размера экрана, а синтаксис очень прост и удобен.

@media screen and (min-width: 600px) and (max-width: 900px) {
  .class {
   background: #333;
  }
}

Пока он находится внизу вашего документа CSS, он перезапишет все ранее существовавшие стили. Это говорит о том, что этот стиль применяется, когда размер экрана составляет от 600 до 900 пикселей. Это означает, что для проверки вы можете масштабировать размер своего браузера, чтобы увидеть разницу.

Подробнее о медиазапросах: http://webdesignerwall.com/tutorials/css3-media-queries

TL; DR jQuery UI и мобильные устройства поддерживают темы, поэтому используйте медиа-запросы в зависимости от того, что вам нравится.

person Aaron Miler    schedule 22.06.2012
comment
Это кажется хорошим маршрутом. И, насколько я понимаю, это переопределит, и поэтому я мог бы даже попытаться поместить это в мой текущий шаблон xml для блоггера, чтобы масштабировать его? - person Cory Gross; 22.06.2012
comment
Медиа-запросы — это атрибут CSS, поэтому, если вы работаете с ними на этом конце, тогда да. Вы даже можете полностью переписать правило CSS в медиа-запросах, если хотите. - person Aaron Miler; 22.06.2012