jQuery Mobile - pytania do wywiadu

Jest to framework interfejsu użytkownika, który jest oparty na rdzeniu jQuery i służy do tworzenia responsywnych stron internetowych lub aplikacji dostępnych na urządzeniach mobilnych, tabletach i komputerach stacjonarnych.

• Tworzy aplikacje internetowe w taki sposób, aby działały w ten sam sposób na urządzeniach mobilnych, tabletach i komputerach stacjonarnych.

• Jest kompatybilny z innymi frameworkami, takimi jak PhoneGap, Whitelight itp.

• Zapewnia zestaw przyjaznych dla dotyku danych wejściowych i widżetów interfejsu użytkownika.

• Zapewnia funkcjonalność na wszystkich platformach mobilnych, tabletach i komputerach stacjonarnych oraz zapewnia wydajne ładowanie stron i szerszą obsługę urządzeń.

• Jest zbudowany na bazie jQuery Core i "pisz mniej, rób więcej".

• Jest to open source, wieloplatformowy i kompatybilny z różnymi przeglądarkami.

• Jest napisany w JavaScript i wykorzystuje funkcje jQuery i jQueryUI do tworzenia przyjaznych mobilnych witryn.

• Integruje HTML5, CCS3, jQuery i jQueryUI w jedną strukturę do tworzenia stron przy minimalnej liczbie skryptów.

• Zawiera system nawigacji Ajax, który wykorzystuje animowane przejścia stron.

• Łatwo jest nauczyć się i rozwijać aplikacje, jeśli znasz HTML5, funkcje CSS3.

• Jest kompatybilny z różnymi platformami i przeglądarkami, więc nie musisz się martwić pisaniem innego kodu dla każdej rozdzielczości urządzenia.

• Używa HTML5 wraz z JavaScript do łatwego tworzenia aplikacji internetowych.

• Jest zbudowany w taki sposób, że umożliwia automatyczne skalowanie tego samego kodu z ekranu mobilnego do ekranu komputera.

• Istnieje ograniczona liczba opcji dla motywów CSS, więc witryny mogą wyglądać podobnie, które są zbudowane na podstawie tych motywów.

• Aplikacje opracowane przy użyciu jQuery Mobile działają wolniej na telefonach komórkowych.

• Połączenie jQuery mobile z innymi platformami mobilnymi staje się bardziej czasochłonne.

• Trudne do zapewnienia pełnego, niestandardowego projektu wizualnego.

• Custom Download : Aby pobrać dostosowaną wersję biblioteki.

• Latest Stable: Aby uzyskać stabilną i najnowszą wersję biblioteki jQuery Mobile.

Możesz użyć następujących plików CDN -

• <link rel = "stylesheet" href = "https://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.css">

• <script src = "https://code.jquery.com/jquery-1.11.3.min.js"> </script>

• <script src = "https://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.js"> </script>

<div data-role = "page" id = "pageone">
    <div data-role = "header">
      <h1>Header</h1>
    </div>

    <div data-role = "main" class = "ui-content">
      //content goes here
    </div>

    <div data-role = "footer">
      <h1>Footer</h1>
    </div>
</div>

Tworzy nagłówek u góry strony.

Służy do określenia zawartości strony.

Tworzy stopkę na dole strony.

Obejmuje dopełnienie i marginesy w treści strony.

W jednym dokumencie mobilnym jQuery można umieścić wiele stron, które ładują się razem, dodając wiele elementów div z atrybutem data-role = "page".

Użyj atrybutu data-dialog = "true" na dowolnej stronie, aby wyświetlić okno dialogowe.

Atrybut przejścia danych służy do stosowania różnych przejść w oknie dialogowym, takich jak slidedown, flip itp.

Przycisk można zamknąć za pomocą atrybutu data-close-btn.

Atrybut data-rel = "back" służy do nawigacji w celu powrotu do poprzedniego okna dialogowego.

Motyw można włączyć do okna dialogowego, dodając atrybut data-theme do dowolnych kontenerów, takich jak nagłówek, stopka lub zawartość.

ui-corner-all

Możesz ustawić ikonę na przycisku za pomocą klasy ui-icon i klasy ui-btn-icon-pos_name w celu określenia pozycji ikony.

Możesz dodać cień ikony do swojego przycisku, używając klasy ui-shadow-icon.

Możesz usunąć szare kółko wokół ikony, używając klasy ui-nodisc-icon.

Użyj klasy ui-grid-solo w znaczniku div, aby utworzyć pojedynczą siatkę kolumn.

Dodaj class ui-grid-a do znacznika div i dołącz dwa kontenery podrzędne z klasami ui-block-a i ui-block-b, aby utworzyć układ dwóch kolumn.

Użyj klasy ui-grid-b w znaczniku DIV, aby utworzyć siatkę z trzema kolumnami.

Użyj klasy ui-grid-c w znaczniku div, aby utworzyć czterokolumnową siatkę.

Użyj klasy ui-grid-d w znaczniku div, aby utworzyć siatkę z pięcioma kolumnami.

Utwórz prosty, podstawowy przycisk na stronie, używając klasy ui-btn.

Utwórz grupę przycisków w pionie i poziomie na stronie, używając atrybutu data-role = "controlgroup".

Możesz utworzyć mniejszy przycisk na stronie za pomocą klasy ui-mini i wyświetlić położenie ikon w przycisku za pomocą klasy ui-btn-icon-ico_pos.

Użyj atrybutu data-role = "data" w polu wejściowym, aby wyświetlić w formacie dd / mm / rr.

Zwijany można utworzyć, używając atrybutu data-role = "collapsible" do kontenera.

Grupę kontrolną można wyświetlić za pomocą atrybutu data-role = "controlgroup".

Używając atrybutu data-filter = "true", możesz filtrować elementy potomne dowolnego elementu.

Przełącznik odwracania umożliwia wyłączenie / włączenie lub włączenie lub wyłączenie przełącznika, klikając go, aby wprowadzić dane w stylu boolowskim.

Widok listy służy do wyświetlania listy elementów. Atrybut data-role = "listview" jest zawarty w kontenerze, aby wyświetlić listę na liście przewijanej w pionie.

Widżet Rangeslider udostępnia parę uchwytów umożliwiających wybór zakresu wartości liczbowych.

Zdarzenie zareaguje na interakcję użytkownika, gdy użytkownik kliknie określoną stronę lub najedzie myszką na element itp.

Jest uruchamiany, gdy użytkownik dotknie elementu przy użyciu identyfikatora strony do określenia zdarzenia, a metoda on () dołącza programy obsługi zdarzeń.

Uruchamia się, gdy użytkownik przeciągnie poziomo więcej niż 30 pikseli nad elementem, używając identyfikatora strony do określenia zdarzenia, a metoda on () dołącza programy obsługi zdarzeń.

Zdarzenie Scroll start jest wywoływane, gdy użytkownik rozpoczyna przewijanie strony, a zdarzenie zatrzymania przewijania - gdy użytkownik przestaje przewijać stronę, używając identyfikatora strony do określenia zdarzenia, a metoda on () dołącza programy obsługi zdarzeń.

Zdarzenie orientacji można wyzwolić, gdy użytkownik obróci urządzenie w pionie lub w poziomie, używając zdarzenia zmiany orientacji . Używa właściwości window.orientation, aby określić, czy okno lub urządzenie ma ustawioną orientację pionową czy poziomą.

Możesz wyświetlić wartość suwaka jako podpowiedź, używając atrybutu data-popup-enabled = "true".

Przełącznik kolumn umieszcza kolumny w ukryciu i umożliwia użytkownikowi wybranie kolumn zgodnie z ich wyborem przy użyciu atrybutu data-mode = "columntoggle".

Reprezentuje dane w formacie poziomym, zwijając tabelę w reprezentację stosową przy użyciu atrybutu data-mode = "reflow".

Możesz wyświetlać zestawy danych w formacie stripes i strokes, używając klas table-stripe i table-stroke.

Możesz zwiększyć jakość i funkcjonalność wprowadzania tekstu, ustawiając atrybut data-Enhanced = "true" w polu wejściowym.

Możesz zmienić kolor ikony na czarny, używając klasy ui-alt-icon. Domyślnie wszystkie ikony są białe.

Został opracowany przez zespół projektowy jQuery w roku 2010 i napisany w JavaScript.

Wskazuje, czy strony muszą być ładowane przez AJAX, czy nie.