2015-03-20 4 views
0

Я разрабатываю мобильное приложение с использованием HTML5, CSS3, jQuery (jquery.mobile-1.4.5.css). В одной части приложения у меня есть раскрывающееся меню, из которого пользователь выбирает конкретное значение.Change Styling jQuery Dropdown

<div style="margin-top:08%"> 
    <select id="dispMOD" onchange="getID(selectedIndex)" style="display: block;margin-left: 10%;margin-right: 10%;"> 
     <option>Select Recipient</option> 
    </select> 
    <textarea id="remarksBox" placeholder="Enter Remarks here..." rows="6" style="border: 1px solid; margin-top:04%; text-align:left;width:75%;display: block;margin-left: auto;margin-right: auto;"></textarea> 
    <button class="button icon-right ion-paper-airplane button-small button-dark" onclick="submit()" id="submit"style="margin: 0 auto;width:40%;">Send</button></div> 

Теперь я хочу, чтобы изменить стиль (высота, ширина, текст) в выпадающем списке (выберите тег) из jQuery.css файла, но я не могу найти что соответствующий элемент должен быть изменен. Может кто-нибудь, пожалуйста, помогите мне с этим?

Спасибо.

+0

Я разрабатываю приложение для устройств Android с версией 4.0 или выше – user3932624

+0

Когда вы отключите собственный стиль, вы можете изменить способ отображения и параметров. –

ответ

-1

При использовании JQuery мобильного варианта по умолчанию для отображения выбора/опции зависит от платформы, которую вы просматриваете страницу в. Приведенном выше коде будет показывать регулярных выбор параметров в рабочем столе, стиле яблочного выбрать в прошивке и Android стиле в Устройства Android

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

Тогда вы можете легко переписать стиль этих элементов.

Чтобы использовать пользовательский дисплей набор данных атрибутов data-native-menu="false" из выбора тега

DEMO: http://jsfiddle.net/06h8u5La/

<select id="dispMOD" onchange="getID(selectedIndex)" style="display: block;margin-left: 10%;margin-right: 10%;" data-native-menu="false"> 
    <option>Select Recipient</option> 
</select> 

enter image description here

EDIT

я проверил скрипка однако, я не могу отредактировать стиль для выпадающего списка. Напр. в приведенном выше образце растягивается по всей странице; Я не могу решить, насколько должна быть ширина оф. Добавление поля не помогло, как вы можете видеть. - user3932624 3 минуты назад

Класс выберите это ui-select и варианты находятся в скрытом div, которые будут отображаться при выбрать щелкают класс div является ui-selectmenu

Используйте свой чтобы проверить, что такое элемент.

+0

Я проверил скрипку, однако, я не могу редактировать стиль для выпадающего списка. Напр. в приведенном выше примере . Добавление поля не помогло, как вы можете видеть. – user3932624

+0

Да, потому что выбор заменяется на 'div'. вы должны проверить и отредактировать стиль этих элементов. –

+0

Хорошо ... позвольте мне проверить и вернуться к вам на этом ..... Спасибо! – user3932624

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