Najlepszy samouczek jQuery komórkowy pasek nawigacyjny W 2024 r. W tym samouczku możesz dowiedzieć się Przykłady,Nawigacja ikony przycisków,Przykłady,icon Lokalizacja,przycisk aktywacji,Przykłady,Przykłady,Więcej przykładów,
Pasek nawigacyjny jest zbiorem linków ułożonych poziomo kompozycji, zazwyczaj zawarty w głowę lub ogon.
Domyślnie linki w pasku nawigacyjnym automatycznie zostanie przycisk (brak danych-role = "button").
Korzystanie data-role = "NavBar" przypisują zdefiniowanie paska nawigacji:
Domyślnie szerokość przycisku, a jej zawartość jest identyczna. Użyj listę nieuporządkowaną, aby równomiernie podzielić szerokość przycisków: jeden przycisk do 100% szerokości dwóch przycisków każda stanowiło 50% szerokości trzech przycisków każde stanowiło 33,3% szerokości, i tak dalej. Jednakże, jeśli podasz więcej niż pięć przycisków na pasku nawigacyjnym zostaną podzielone na wiele linii (patrz "Więcej przykładów"). |
Możemy użyć atrybutu danych ikonę, aby dodać ikony przycisków nawigacyjnych:
atrybutów danych ikona z sekcji klasy CSS ikony przy użyciu tej samej wartości. Klasa CSS użyć class = "ui-icon- wartość" , ikona danych atrybutu wykorzystać dane-icon = "wartość".
Wartość nieruchomości | opis | ikona |
---|---|---|
Dane-icon = "home" | dom | |
Dane-icon = "strzałka-R" | Po prawej strzałki | |
Dane-icon = "search" | poszukiwanie |
Dla kompletnego podręcznika dla wszystkich ikon przycisków jQuery telefonów, odwiedź naszą jQuery Telefony Instrukcja ikona Reference .
Podobnie jak "ui-btn-icon- pozycji" tej samej kategorii (fragment ikony są opisane w szczegółach), można ustawić lokalizację ikony wyświetlanej: górną (głowa), prawo (po prawej), na dole (na dole) lub w lewo (po lewej stronie ).
Lokalizacja ikona na pasku nawigacyjnym pojemnika jest za pomocą wymiany danych za iconpos atrybut, aby określić lokalizację:
Wartość nieruchomości | opis | Przykłady |
---|---|---|
data-iconpos = "top" | Wyrównaj górną ikonę | próbować |
data-iconpos = "right" | Ikona po prawej wyrównane | próbować |
data-iconpos = "bottom" | Wyrównaj dolną ikonę | próbować |
data-iconpos = "left" | Wyrównaj lewą ikonę | próbować |
Domyślnie ikona znajduje się nad tekstem przyciski nawigacyjne (dane-iconpos = "top"). |
Gdy link na pasku nawigacyjnym kliknięciu, zostanie on wybrany (wciśnięty) wygląd.
Jeśli chcesz dostać ten występ nie klikaj w link, należy użyć class = "ui-btn-aktywny":
Na wielu stronach, może chcesz sprawdzić wygląd każdego przycisku w imieniu danej strony użytkownik się znajduje. Aby to zrobić, należy dodać "UI-btn-aktywny" link do klasy "ui-state-utrzymują" oraz:
Zawartość paska nawigacyjnego
Jak dodać pasek nawigacji w obrębie data-role = "content".
Ogon pasek nawigacyjny
Jak dodać pasek nawigacji z tyłu.
ikona docelowa w pasku nawigacyjnym
Jak zlokalizować ikonę paska nawigacji w ogonie.
Ponad pięć przycisków
Przycisk 10 Demo w pasku nawigacyjnym.