Как настроить набор переключателей JQuery Mobile в окне просмотра?

Я делаю приложение с помощью JQuery Mobile поверх PhoneGap (Cordova). Я использовал Codiqa, чтобы придумать каркас для моего интерфейса. Пока это выглядит нормально, но группа переключателей, которые я собираюсь использовать для смены просмотров, не была сосредоточена - она была слева на примерно 25 пикселей на веб-браузере размером с WVGA800. При масштабировании до формы планшета группа все больше и больше попадала из центра окна просмотра.Как настроить набор переключателей JQuery Mobile в окне просмотра?

Вот ссылка jsFiddle моего проект с проблемой открепляли - http://jsfiddle.net/jaspermogg/sahXy/1/

Вот ссылка jsFiddle к моему проекту, задаваемый мной - http://jsfiddle.net/jaspermogg/NvMsK

Я придумал решение с использованием JQuery, но я m неопытный и не знаю, в какое событие стрелять.

Когда я загружаю пользовательский интерфейс в Webkit, он создает предварительный сценарий пользовательского интерфейса перед обновлением после < 1s в состоянии после сценария. Это выглядит хромым. У меня установлен мой скрипт для работы на $(window).load.

Вопросы:

Какое событие я должен искать, и не могли бы вы показать мне, как осуществить это?
Является ли мой сценарий в нужном месте - должен ли он находиться внутри страницы, как есть, или снаружи? Или в head даже?
Это действительно глупо делать это с JQ - наверняка, есть способ сделать это с помощью CSS?

Заранее благодарим за любую помощь! Ура!

источник

2012-06-05 Jasper Mogg

Я установил центральное выравнивание с моделью коробки. Хотя это еще не изящное решение (им не так хорошо с css) http://jsfiddle.net/dhavaln/sahXy/3/ – dhaval

этот пост суммирует по крайней мере необходимое решение http://stackoverflow.com/questions/4329866/centering -elements-in-jquery-mobile – dhaval

@dhaval Спасибо, это здорово.То, что я действительно хотел бы сделать, это найти ширину, необходимую мне для установки div до ее отображения. Ваше решение составляет несколько пикселей, потому что вы предоставили бокс-центру статическую ширину. Разумеется, на разных устройствах ширина ширины px будет отличаться, и это сломает страницу? –

Наверное, я ответил на свой вопрос в комментариях выше, поэтому собираюсь формализовать его, приняв мой ответ.

То, что я в конце концов был -

(1) Установите радио пуговиц, содержащий DIV, чтобы visibility: hidden в CSS.

(2) Найдите ширину каждого переключателя и добавьте их вместе.

(3) Установите ширину разделителя, содержащего переключатель, на общую ширину.

(4) Цепь изменяет свойство видимости на (3).

CSS-должен быть установлен, как это -

#viewselector{ 
    margin: 0 auto; 
    text-align: center; 
    visibility: hidden; 
}

код, чтобы сделать (1) до (4) выглядит следующим образом -

$(document).ready(function(){ 

    var idealwidth = 0 

    $(".ui-radio").each(function(){ 
     idealwidth = idealwidth + $(this).width(); 
    }); 

    $("#viewselector").width(idealwidth).css('visibility','visible'); 

});

Надеется, что это помогает кто-то!

источник

2012-06-13 13:25:03

Как настроить набор переключателей JQuery Mobile в окне просмотра?

ответ

Смежные вопросы