Was sind die mobilen JQuery-Bibliotheken?

Jquery-Mobilbibliotheken umfassen: 1. Mobiscroll, verwendet für Rotations-Scrolling, Datums- und Uhrzeitauswahl auf Touchscreen-Geräten; 2. „Ion.Sound“, verwendet für sofortige Tonbenachrichtigungen; 3. Mmenu, verwendet, um eine reibungslose Navigation im Schubladenstil zu erstellen Menü; 4. Naver, wird zum Erstellen einer reaktionsfähigen Navigation verwendet; 5. gShake usw.

Die Betriebsumgebung dieses Tutorials: Windows7-System, jquery1.10.2-Version, Dell G3-Computer.

Mit der Entwicklung des mobilen Internets können sich Webseiten vom PC nicht vollständig an die Anforderungen mobiler Seiten anpassen, was dazu führt, dass ein responsives Design-Erlebnis entsteht und zu einem Trend wird. Diese Art von Nachfrage hat zur Popularität von jQuery Mobile beigetragen . jQuery Mobile, ein auf jQuery und jQuery UI basierendes Framework, erbt die Essenz von jQuerys „Weniger schreiben, mehr tun“, verfügt über eine gute Skalierbarkeit und Anpassbarkeit und ist vollständig kompatibel mit verschiedenen Plattformgeräten. Für nicht unterstützte Mobiltelefontypen gilt dies auch gegeben werden.

Dieser Artikel beschreibt 15 sehr hervorragende und praktische jQuery Mobile-Plug-ins (Bibliotheken), die ein breites Spektrum an Typen abdecken, von Datums-/Uhrzeitauswahl, sofortiger Tonbenachrichtigung, Schubladen-Navigationsmenü, iOS-Stil, Akkordeon-Navigation, Ausblenden/Anzeigen Passwörter, Leuchtkasteneffekte, ziemlich coole interaktive Karten, Seitenvibrationen, Native, Fotoalbum-/Galerieanzeige usw., es gibt immer etwas, das Sie faszinieren wird.

1. Mobiscroll

https://mobiscroll.com/

Für viele Entwickler ist Mobiscroll kein Unbekannter und kann sogar als recht vertraut bezeichnet werden. Mobiscroll ist ein sehr gutes jQuery Mobile-Plug-in, das hauptsächlich für rotierendes Scrollen/Datums- und Uhrzeitauswahl auf Touchscreen-Geräten verwendet wird. Dadurch können Benutzer Datum und Uhrzeit auswählen, indem sie einfach Zahlen verschieben (klicken Sie auf den Link, um die Demo anzuzeigen).

Mobiscroll unterstützt nicht nur alle benutzerdefinierten Werte, sodass Benutzer das Thema vollständig anpassen können, sondern kann auch zur lokalen Auswahlsteuerung von Dropdown-Listen verwendet werden. Darüber hinaus ist es auch sehr benutzerfreundlich. Es bietet Entwicklern nicht nur ein sehr fortschrittliches Farbschema, sondern kann auch vollständig über CSS-Dateien geändert werden. Unterstützt alle gängigen mobilen und Desktop-Browser, einschließlich iOS, Android, WP8, Windows 8, BlackBerry usw.

2. Ion.Sound

http://ionden.com/a/plugins/ion.sound/en.html

Heutzutage sind sowohl Web- als auch mobile Websites voller verschiedener Ereignisse, wie z. neue Chat-Nachrichten, Inhaltsaktualisierungen usw. Allerdings besteht häufig das Problem, dass Sofortbenachrichtigungen nicht sofort die Aufmerksamkeit des Benutzers erregen können. Durch das Ion.Sound Plug-in lässt sich diese Aufgabe sehr gut lösen.

Ion.Sound ist ein jQuery-Plug-in zum Abspielen von Event-Sounds. Es übernimmt die MIT-Lizenz und enthält 25 kostenlose Sounds. Bisher wurde Ion.Sound erfolgreich in Desktop-Browsern wie Google Chrome, Mozilla Firefox, Opera, Safari und IE (9.0+) eingesetzt und unterstützt alle gängigen mobilen Browser.

3. jQuery.mmenu

http://mmenu.frebsite.nl/

jQuery.mmenu ist ein jQuery-Plug-in zum Erstellen reibungsloser Schubladen-Navigationsmenüs mit nur einer Zeile JavaScript-Code Sehr cooles Schiebemenü auf Ihrer mobilen Website, das einer mobilen App ähnelt.

Mit jQuery.mmenu können Entwickler ungeordnete Listen in Menüelemente umwandeln und diese anpassen. jQuery.mmenu bietet Entwicklern nicht nur die Möglichkeit, gängige Menüs wie Öffnen, Schließen, Wechseln usw. anzupassen, sondern bietet auch Einstellungen für die Menüposition (links/rechts), die Anzeige des Menüelementzählers und andere Optionen.

4. Naver

http://www.benplum.com/formstone/naver/

Naver ist ein jQuery-Plug-in, das speziell zum Erstellen einer responsiven Navigation verwendet wird. Dadurch können Entwickler auf einfache Weise Navigationseffekte erstellen, die für mobile Endgeräte sehr benutzerfreundlich sind, und auch eine dynamische Navigation erstellen. Naver ist mit Firefox, Chrome, Safari und IE (7+) kompatibel und wird unter der MIT-Lizenz veröffentlicht. Es kann frei und kostenlos verwendet werden, egal ob in persönlichen oder kommerziellen Projekten.

5, iosOverlay.js

http://taitems.github.io/iOS-Overlay/

iosOverlay.js ist ein jQuery-Plug-in zum Erstellen von Eingabeaufforderungs-/Benachrichtigungseffekten im iOS-Stil, das IE7+ und Google unterstützt Chrome, Firefox, Opera, Safari (Desktop und Mobilgerät). Es sollte daran erinnert werden, dass Entwickler Bildressourcen vorab laden müssen, wenn Sie verhindern möchten, dass das Symbol beim Laden flackert.

Darüber hinaus gibt es zwei optionale Abhängigkeiten für iosOverlay.js, nämlich Spin.js und jQuery. Wenn Entwickler das Dropdown-Listenobjekt verwenden möchten, müssen sie Spin.js verwenden. Für Browser, die nicht mit CSS-Animationen kompatibel sind, ist jQuery zur Unterstützung erforderlich. 6. Easy Responsive Tabs die Verwendung mehrerer Beispiele auf derselben Seite und unterstützt plattformübergreifendes Web, Tablets und mobile Geräte. Dieses Plug-in kann sich an die Bildschirmgröße anpassen. Der Standardstil ist horizontal/vertikal. Wenn das Fenster kleiner wird, wechselt es automatisch zum Akkordeonstil.

7、Passwort ausblenden/anzeigen

https://github.com/cloudfour/hideShowPassword

Mit dem Plugin „Passwort ein-/ausblenden“ können Sie den Inhalt des Passwort-Eingabefelds einfach ein- und ausblenden. Das Coolste an diesem Plugin ist die Option „innerToggle“. Wenn diese Option aktiviert ist, können Entwickler sehr schöne Ein-/Ausblenden-Steuerelemente individuell erstellen. Und der Eingabefokus bleibt beim Wischen in Touchscreen-Browsern erhalten.

8, Swipebox

http://brutaldesign.github.io/swipebox/

Swipebox ist ein wunderschönes jQuery-Lightbox-Effekt-Plug-in, das auf Desktop-, Mobil- und Tablet-Geräten verwendet werden kann. Auf Mobilgeräten wird die Wischgestennavigation unterstützt, während auf dem Desktop die Tastaturnavigation verfügbar ist. Browser, die keine CSS3-Übergangsfunktionen unterstützen, können die jQuery-Downgrade-Verarbeitung verwenden, Retina-Displays unterstützen und können einfach über CSS angepasst werden.

Wenn der Benutzer auf das Zielbild klickt, wird das Foto in voller Größe angezeigt. Darüber hinaus kann der Benutzer auch nach links und rechts wechseln, um die Bilder in derselben Gruppe anzuzeigen, was sich sehr gut zum Erstellen und Anzeigen von Fotogalerien eignet großformatige Bilder.

9. App-Ordner

http://app-folders.com/

Wenn Sie ein iOS-Fan sind, müssen Sie mit Ordnern im iOS-Stil bestens vertraut sein. „Klicken Sie auf den Ordner, um die umgebenden Elemente zu verwischen, indem Sie die Transparenz erhöhen, und zeigen Sie dann den Inhalt des Ordners an.“ App Folders ist ein solches jQuery-Plug-in, das den Effekt von iOS-Ordnern erzielen kann. Dieses Plug-in funktioniert sowohl auf Desktop- als auch auf mobilen Browsern und ist sehr gut anpassbar.

Die Ordnerelemente von App-Ordnern können beliebige HTML-Elemente wie Bilder, Text, Videos usw. enthalten, und jeder Ordner hat seine eigene URL für direkte Klicks. Natürlich müssen sich Entwickler nicht an die gleichen Effekte wie bei iOS-Ordnern halten. Über App-Ordner können Entwickler kreativere Layouts und Spezialeffekte anpassen.

10. jQuery Flip

http://amegan.github.io/jquery-flip/

jQuery Flip ist ein Tool, mit dem jedes HTML-, Text- oder jQuery-Element einen sehr schönen Flipboard-ähnlichen Flip-Effekt erzeugen kann jQuery-Plugin, veröffentlicht unter der MIT-Lizenz. Mithilfe der CSS-3D-Transformation kann auch die Flip-Geschwindigkeit eingestellt werden und WebKit-Browser wie Chrome, Safari und Firefox 11 werden vollständig unterstützt.

11. jQuery UI Map

https://code.google.com/p/jquery-ui-map/

Für Entwickler von Kartenanwendungen ist jQuery UI Map definitiv ein unverzichtbares Tool für die Entwicklung. Ein solches leichtes jQuery-Plug-in unterscheidet sich von der Google Map API. Durch jQuery UI Map können Entwickler nicht nur Google-Ereignis-Listener für einfache Ereignisse wie Klicks verwenden, sondern auch jQuery-Klickereignisse für Karten und Markierungen.

jQuery UI Map ist nicht nur sehr flexibel, sondern auch hochgradig anpassbar. Um geplante Ereignisse auf einer Karte anzuzeigen, lässt sich jQuery UI Map in Google Maps integrieren, sodass Entwickler ganz einfach interaktive Karten erstellen können. Das größte Merkmal von jQuery UI Map besteht darin, dass Entwickler HTML-Datenformate wie Mikroformate, RDFa oder Mikrodaten verwenden können, um eine Synchronisierung auf der alternativen Site zu erreichen, wenn der Client kein JavaScript unterstützt.

12, gShake

https://github.com/GerManson/gShake

gShake ist ein jQuery-Plug-in, das mit nur wenigen Codezeilen Navigation, Bilder usw. erstellen kann. und sogar die Seite selbst wackelt, was die Seite dynamisch und unterhaltsam macht. Sie unterstützt iOS 4.2+.

13. jQTouch

http://jqtjs.com/

Im Vergleich zu vielen in diesem Artikel vorgestellten jQuery-Plug-Ins, die für die mobile Entwicklung verwendet werden können, ist jQTouch offensichtlich bekannter. Mit jQTouch können Entwickler sehr leistungsstarke mobile Apps erstellen, die nur HTML, CSS und jQuery verwenden. Was noch großartiger ist, ist, dass Entwickler eine vollständig angepasste Benutzeroberfläche erstellen können, die nur Kern-CSS-Dateien verwendet.

jQTouch kann gängige UI-Effekte wie Animation, Listennavigation, Standardstile usw. in WebKit-Browsern auf Mobilgeräten implementieren. Wenn Sie jedoch mehr native Effekte erzielen möchten, müssen Sie zusätzliche CSS-Dateien hinzufügen. Für iOS-Entwickler besteht darüber kein Grund zur Sorge, da jQTouch einen umfangreichen Satz nativer Effekt-CSS-Dateien für die iOS-Entwicklung bereitstellt.

14, PhotoSwipe

http://www.photoswipe.com/

PhotoSwipe ist ein Open-Source- und kostenloses Fotoalbum-/Galerie-Anzeigepaket, das speziell für mobile Touchscreen-Geräte entwickelt wurde und mit iOS, Android, Blackberry und anderen kompatibel ist andere Mainstream-Plattformen und Desktop-Browser. Die zugrunde liegende Implementierung basiert auf HTML, CSS und JavaScript und ist nicht auf ein Framework angewiesen. Sie eignet sich sehr gut für Designer und Entwickler, die das Fotoalbum-Erlebnis mobiler Websites mit dem nativer Apps vergleichen möchten.

PhotoSwipe ist eine eigenständige JavaScript-Bibliothek, die sich leicht in mobile Websites integrieren lässt und stark für mobile Browser optimiert ist. Darüber hinaus bietet PhotoSwipe im Quellcode auch Unterstützung für Desktop-Browser und die Verwendung von jQuery Mobile.

15. Touch Gallery

http://neteye.github.io/touch-gallery.html

Wie PhotoSwipe ist auch Touch Gallery ein Bildanzeige-Plug-in. Damit können Entwickler Bilder auf Mobilgeräten anzeigen Browsern, um einen ähnlichen Bildanzeigeeffekt wie bei der nativen Fotoalbumanwendung zu erzielen. Es unterstützt Gesten-Browsing-Vorgänge und kann auch in Desktop-Browsern wie Safari, Firefox, Opera und Chrome verwendet werden, einige Funktionen können jedoch nicht implementiert werden.

【Empfohlenes Lernen: jQuery-Video-Tutorial, Web-Front-End-Video】

Das obige ist der detaillierte Inhalt vonWas sind die mobilen JQuery-Bibliotheken?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!