Значки Кнопок jQuery Mobile
jQuery Mobile обеспечивает ряд значков, которые заставят Ваши кнопки выглядеть более привлекательными.
Добавление Значков к Кнопкам jQuery Mobile
Чтобы добавить значок в Вашу кнопку, используйте атрибут data-icon:
Подсказка: Можно также использовать атрибут data-icon в элементах <button> и <input>.
Ниже мы перечислили некоторые доступные значки, которые обеспечивает jQuery Mobile:
Значение Атрибута | Описание | Значок | Пример |
---|---|---|---|
data-icon="arrow-l" | Стрелка Влево | Показать | |
data-icon="arrow-r" | Стрелка Вправо | Показать | |
data-icon="delete" | Удалить | Показать | |
data-icon="info" | Информация | Показать | |
data-icon="home" | Главная | Показать | |
data-icon="back" | Назад | Показать | |
data-icon="search" | Поиск | Показать | |
data-icon="grid" | Таблица | Показать |
Расположение Значков
Можно также указать, где значок должен быть расположен на кнопке: верхняя часть, справа, нижняя часть или слева.
Используйте атрибут data-iconpos, чтобы указать позицию:
Позиции значка:
<a href="#link" data-role="button" data-icon="search" data-iconpos="right">Справа</a>
<a href="#link" data-role="button" data-icon="search" data-iconpos="bottom">Снизу</a>
<a href="#link" data-role="button" data-icon="search" data-iconpos="left">Слева</a>
Попробуйте сами »
По умолчанию все значки в кнопках помещаются налево.
Отображение Только Значка
Чтобы вывести на экран только значок, установите data-iconpos в "notext":
Пример:
Попробуйте сами »