Как остановить JQM от стилизации страницы?

Ответ 1

Вы можете использовать data-enhance="false" вместе с $.mobile.ignoreContentEnabled=true, чтобы остановить автоматическое повышение, которое jQuery Mobile делает на псевдостранице:

<link rel="stylesheet" href="http://code.jquery.com/mobile/1.1.0-rc.1/jquery.mobile-1.1.0-rc.1.min.css" />
<script src="http://code.jquery.com/jquery-1.7.1.min.js"></script>
<script>
$(document).on('mobileinit', function () {
    $.mobile.ignoreContentEnabled = true;
});
</script>
<script src="http://code.jquery.com/mobile/1.1.0-rc.1/jquery.mobile-1.1.0-rc.1.min.js"></script>

<div data-enhance="false" data-role="page">
    ...
</div>​

Причина, по которой вам нужно изменить флаг ignoreContentEnabled, заключается в том, что он интенсивно работает с CPU для поиска родительских элементов для data-attribute, поэтому по умолчанию это отключено.

Вот демонстрационная версия: http://jsfiddle.net/ZtJyL/1/

Ответ 2

Как я уже указывал здесь, вы также можете использовать официальную тему-меньше версии CSS, созданной специально для создания пользовательской темы.

По моему опыту, использование хаков, таких как data-enhance="false" и data-role="none", часто ломается и со структурным, нетематическим CSS.

С помощью этого метода вы можете сохранить все основные функции jQuery Mobile, вам не нужно постоянно бороться с хаками и переопределять, и вы получаете более легкий CSS в качестве бонуса.