Latest web development tutorials

listy zawartości jQuery komórkowy


Ikona jQuery mobile

Domyślnie każdy element lista będzie zawierać ikonę strzałki "karatowego-R" (strzałka w prawo). Jeśli chcesz zmienić tę ikonę, można użyć atrybutu danych ICON:

Przykłady

<Ul data-role = "ListView">
<Li> <a href="#"> Domyślnie jest strzałka w prawo </a> </ li>
<Li danych ikona = "plus"> <a href="#"> danych ikona = "plus" </a> </ li>
<Li danych ikona = "minus"> <a href="#"> danych ikona = "minus" </a> </ li>
<Li danych ikona = "delete"> <a href="#"> danych ikona = "delete" </a> </ li>
<Li danych ikona = "location"> <a href="#"> danych ikona = "lokalizacja" </a> </ li>
<Li danych ikona = "false"> <a href="#"> danych ikona = "false" </a> </ li>
</ Ul>

Spróbuj »
uwaga Dane-icon = "false" usunie ikonę.

Pełniejszy jQuery Telefony ikony przycisków, odwiedź naszą jQuery Telefony Instrukcja ikona Reference .


ikona 16x16

Jeśli chcesz dodać do swojej listy kryteriów 16x16px ikony, można dodać element <img> w pozycji z listy i wybierz kategorię "ui-li-ikonę":

Przykłady

<Ul data-role = "ListView">
<Li> <a href="#"> <img src = "us.png" alt = "USA" class = "ui-li-icon"> USA </a> </ li>
</ Ul>

Spróbuj »

jQuery Komórka lista miniatur

Obraz większy niż 16x16px, dodać element <img> w linku.

jQuery Mobile automatycznie skaluje obraz do 80x80px:

Przykłady

<ul data-role="listview">
<li><a href="#"><img src="chrome.png"></a></li>
</ul>

Spróbuj »

Użyj standardowego kodu HTML, aby dodać listę informacji:

Przykłady

<ul data-role="listview">
<li>
<a href="#">
<img src="chrome.png">
<h2>Google Chrome</h2>
<p>Google Chrome 免费的开源 web 浏览器。发布于 2008 年。</p>
</a>
</li>
</ul>

Spróbuj »


Ikona jQuery mobile

Na liście <img> elementu używa class = "ui-li-ikona" Dodaj 16x16px ikonę:

Przykłady

<li><a href="#"><img src="us.png" alt="USA" class="ui-li-icon" >USA</a></li>

Spróbuj »


przycisk Splicie

JQuery komórkowy na liście, czasem jest to konieczne, aby dwa różne opcje za treść operacji, a następnie, potrzeba opcji Link przyciskowy segmentacji. Metoda segmentacji jest uzyskanie elementu <li> by dodać <a> elementu, może osiągnąć efekt podziału strony.

jQuery Mobile automatycznie ustawić niebieskie strzałki ikonę drugiego łącza, ikona jest wyświetlana, gdy tekst linku (jeśli w ogóle) w użytkownik najeżdża kursorem na ikonę:

Przykłady

<ul data-role="listview">
<li>
<a href="#"><img src="chrome.png"></a>
<a href="#">Some Text</a>
</li>
</ul>

Spróbuj »

Dodaj kilka stron i okien dialogowych, aby link więcej bogate w funkcje:

Przykłady

<ul data-role="listview">
<li>
<a href="#"><img src="chrome.png"></a>
<a href="#download" data-rel="dialog">下载浏览器</a>
</li>
</ul>

Spróbuj »


bańka cyfrowe

Bubble numery są wykorzystywane do wyświetlania listy numer przyporządkowany element, takich jak skrzynki pocztowej:

Aby dodać numery bańka, z wykorzystaniem elementów wbudowanych, takich jak <span>, ustawić atrybut class "ui-li-count" i dodać numery:

Przykłady

<ul data-role="listview">
<li><a href="#">收件箱<span class="ui-li-count" >25</span></a></li>
<li><a href="#">发件箱<span class="ui-li-count" >432</span></a></li>
<li><a href="#">垃圾箱<span class="ui-li-count" >7</span></a></li>
</ul>

Spróbuj »

Uwaga: Prawidłowe wyświetlanie bańce cyfrowej, należy zmodyfikować programowanie. Zostanie to wyjaśnione w późniejszych rozdziałach.


Przykłady

Więcej przykładów

lista Pop
Jak utworzyć listę pop

Zmiana listy pozycji domyślnej Link ikona
Jak ustawić elementy domyślnej listy Link (domyślne ikony strzałki w prawo).

Składany lista pop
Jak utworzyć listę składaną pop.

Lista składana
Jak utworzyć listę pokaż / ukryj.

Więcej formatów
Jak utworzyć kalendarza.