jquery мобильный пользовательский css?

Question

привет, я только что закончил разработку мобильного веб-приложения и теперь хочу начать процесс разработки. Я читал, что очень сложно использовать пользовательский css с JQuery Mobile, и поэтому проект, который я только что завершил, не может использоваться с такой структурой.

Есть ли решение или, возможно, еще одна инфраструктура, которая поддерживает функции JQM, но в то же время позволяет разработчику свободно использовать свой собственный дизайн.

Answer 1

Я не знаю, читали ли вы, что его трудно использовать пользовательский css с jQuery mobile. Его конструкция легко настраивается. Проверить http://jquerymobile.com/themeroller/

Если вы заинтересованы в персонализированном содержании на вашем сайте проверить эту часть документации: http://jquerymobile.com/demos/1.0.1/docs/content/index.html - например макет сетка может помочь вам с вашим индивидуальным дизайном

Другой рамочным я могу предложить юй http://yuilibrary.com/ (например, css grid part in documentation также может помочь вам с вашим дизайном)

Удачи!

Answer 2

У меня тоже была аналогичная проблема с JQM, но я принял решение раньше и переключился на jQTouch из-за его простоты. Конечно, он не предлагает столько виджетов, сколько JQM.

Глядя на ваше требование, я рекомендую вам пойти на jQTouch как это имеет минимальный CSS (не столь громоздки, как Сенча сенсорный или JQM). Вы сможете прокрутить собственную тему за несколько часов.

Answer 3

Существует огромное заблуждение относительно использования ваших собственных стилей с JQM, которые я нашел везде, включая SO. Трюк с использованием собственного CSS с JQM заключается в том, как вы пишете собственный CSS. В общем, вы должны сначала указать элемент, который вы хотите переопределить CSS JQM с идентификатором, а затем присоединить класс JQM к этому идентификатору. Например, чтобы удалить стандартную линию ссылок JQM с помощью ссылки на изображение, где # img_button_1 - это идентификатор, предоставленный якорному родительскому изображению изображения, вы бы закодировали свой CSS так ...

HTML ...

<a id="img_button_1" data-role="button" data-theme="none" data-corners="false" data-shadow="false" data-inline="true" 
    href="http://www.google.com" target="_blank"> 
    <img src="http://www.google.com/images/srpr/logo1w.png" alt="Google" /> 
</a> 

переопределения CSS ...

#img_button_1 .ui-btn-inner { border: 0 } 

Я ответил на этот вопрос, прежде чем с некоторыми рабочими примерами, которые можно найти здесь

Jquery Mobile - Using image as link - Blue line below image

Вы можете использовать ту же технику для разрешения всех конфликтов JQM CSS. Теперь вы можете пересмотреть использование JQM для достижения желаемых результатов, зная, насколько просто разрешать эти конфликты, используя спецификацию CSS в вашем собственном CSS. Надеюсь это поможет!

Answer 4

JQM не легко настраиваемый посмотреть здесь:

http://forum.jquery.com/topic/use-custom-css-with-jquerymobile

Быстрого и грязный способ добавить «стиль» тег непосредственно в/вводе/текстовую области сНа, что там у вас. Это легко переопределяет значение jQuery по умолчанию.

Или, если вы меняете стиль всех входов, например, вы можете скопировать класс стиля jquery и вставить его в свой css. Это также переопределит стиль JQM, но обратите внимание, что при этом изменяется каждый экземпляр, где отображается этот конкретный класс.

Answer 5

На самом деле, я легко настраивал мобильные приложения jQuery в дизайне. Работа вокруг заключается в том, чтобы ваш стиль = "" был написан после занятий; который корректирует сценарии ранее. Это может быть не традиционно чистым, но это быстрое исправление, пока не будет найдено лучшее решение.

Например:

<div data-role="header" role="banner" style="background:none; border:none;"> 
    <div class="ui-logo" ></div> 
</div> 

Отличная альтернатива я нашел, чтобы поместить пользовательский класс CSS после всех других классов JQuery UI, и указать каждой из основных свойств соответствующего класса, как «важно! ». Это решение, которое я использую сейчас.