Die 20 praktischsten und kreativsten Anwendungen von jQuery

Es gibt viele Beiträge zur Anzahl der tollen jQuery-Plugins und wo sie zu finden sind. Manchmal ist es jedoch am besten, sich nicht auf Plugins und Ressourcen von Drittanbietern zu verlassen. Tun Sie es selbst auf altmodische Weise! Heute werden wir einen Blick auf über 20 kreative Anwendungen von jQuery in modernen Websites und Anwendungen werfen. Sie sicher für Ihr nächstes Projekt zu begeistern.

  • James Padolsey Farbumschalter

    Einer unserer sporadischen Autoren, James Padolsey, hat eine nette Funktion auf seiner Website. Über eine Leiste zum Anpassen im oberen rechten Bereich des Bildschirms können Sie die Hintergrundfarbe der Kopfzeile ändern.

    Besucherseite

  • Dragon Interactives jQuery Navigation

    Diese Jungs sind so ziemlich Götter des Webdesigns, und ihre Seite beweist es wirklich. Schauen Sie sich einfach die benutzerdefinierte jQuery-Navigation an, die sie auf ihrer Homepage verwendet haben. Haben Sie jemals eine so sexy Navigation in Ihrem Leben gesehen??

    Besucherseite

  • FamSpams FaceBox

    FamFamFam benötigte ein benutzerdefiniertes Leuchtkasten-Skript für FamSpam (wow, sagen Sie das dreimal). Am Ende bauten sie das, was heute als FaceBox bekannt ist. Diese Funktion repliziert die Auswirkungen von Leuchtkasten, bietet jedoch noch mehr Möglichkeiten, statische HTML-Seiten, Kontaktformulare und alles, was Sie wirklich wollen, zu laden. FaceBox ist jetzt ein jQuery-Plugin, obwohl alle Anforderungen an das Skript gestellt werden.

    Besucherseite

  • Grooveshark Widget Ersteller

    Anstatt mit einem typischen Flash-Menü / Steuerungsmenü zu arbeiten, hat Grooveshark ein wenig aufgemischt und ein benutzerdefiniertes jQuery-Skript erstellt, mit dem Sie Ihre eigenen Musik-Widgets erstellen können. ziemlich schlau.

    Besucherseite

  • CSS-Tricks-Einblendnavigation

    CSS-Tricks von Chris Coyier stehen auf der Liste mit einer wunderbar einfachen und kreativen jQuery-Navigation. Wenn die Verknüpfungen mit der Maus verschoben werden, anstatt sie sofort zu ändern, wird jQuery verwendet, damit die Farbe langsam zur gewünschten Farbe übergeht.

    Besucherseite

  • David Walsh Link Nudge

    Der Entwickler David Walsh von DavidWalsh.name implementiert ein extrem einfach zu verwendendes Skript, um Ihren Links beim Schweben einen kleinen Schubs zu geben. Das Skript nutzt die starken Animationsfunktionen von jQuery, die beim Schweben ausgelöst werden. Überprüfen Sie die Links in der Seitenleiste und in der Fußzeile, um den Effekt in Aktion zu sehen.

    Besucherseite

  • CarrotCreative-Custom-Sites-Lightbox

    Wenn Sie die CarrotCreative-Website besuchen, werden Sie tatsächlich zwei wirklich einzigartige jQuery-Effekte feststellen. Wenn Sie oben links auf Sites klicken, sehen Sie eine einmalige Anwendung eines "Leuchtkasten" -ähnlichen Effekts, der deren Sites und Symbole auflistet. Zweitens: Wenn Sie auf einen der Navigationslinks klicken, werden Sie feststellen, dass keine Aktualisierung erfolgt, die neue Seite jedoch nur von rechts eingeblendet wird. Cooles Zeug!

    Besucherseite

  • BrightCreative Portfolio

    Ein weiteres "Two for One" -Spezial, Bright Creative verwendet einen äußerst subtilen Glüh-Effekt in der Navigation, der sehr beruhigend und warm ist. Darüber hinaus haben alle ihre Portfolio-Seiten einen Tab-Effekt, sodass der Benutzer die Seite nicht jedes Mal aktualisieren muss - dank AJAX und jQuery.

    Besucherseite

  • Unglaubliches Anmeldeformular

    Vor nicht allzu langer Zeit hat uns Connor Zwick ein nettes Tutorial geschrieben, in dem genau beschrieben wird, wie man ein erstaunliches Anmeldeformular für Drop-Downs erstellt.

    Besucherseite

  • Anwendungs-Scroller von Aviary

    Es wäre eine Beleidigung, dies als eine Art "Festzelt" zu bezeichnen. Stattdessen hat Aviary einen sehr gut aussehenden und funktionierenden "Scroller" entwickelt, um auf kleinem Raum viel Text zu präsentieren. Noch besser ist, dass der Scroller sich gänzlich abbaut, wenn Javascript deaktiviert ist.

    Besucherseite

  • Empfohlener Fade-Effekt von DesignFlavr

    DesignFlavr, bekannt für seine großen Quellen der Designinspiration, hat ein einfaches FadeIn / FadeOut-Skript zusammengestellt, um die vorgestellten Kunstwerke und die zugehörigen Beschreibungen zu präsentieren. Außerdem haben sie das Lavalamp-Plugin in ihrer Hauptnavigation gut eingesetzt.

    Besucherseite

  • Hv-Designs Einblenden RSS Symbol

    Auf der Homepage von Hv-Designs werden Sie feststellen, dass das RSS-Symbol als Umriss / Skizze des tatsächlichen Bildes beginnt. Wenn sie sich im Schwebeflug befinden, "glühen" die rss-Symbole an Ort und Stelle.

    Besucherseite

  • Asyls Custom Scroller

    Asylum ist nicht nur eine absolut witzige Website, sondern auch ein eigenes, souveränes Scrollen mit Artikeln. Es ist schwer zu sagen, warum dieser so schön ist, aber das liegt wahrscheinlich daran, dass er sich etwas anders verhält als die meisten Scripts. Es scheint fast zu rasten, nachdem Sie einen Klick gedrückt haben.

    Besucherseite

  • 5 Javascript-Tricks leicht gemacht mit jQuery

    Brian Reindel hat eine Webseite mit 5 benutzerdefinierten Skripts erstellt, die Sie nach Belieben verwenden können. In diesem Artikel werden häufig verwendete Ideen und frühere Javascript-Techniken verwendet. Mit jQuery werden sie leistungsfähig, kompakt und leicht lesbar.

    Besucherseite

  • Codas gesamte Website

    Coda ist bekannt für seine erstaunliche Benutzeroberfläche und das Site-Design. Es löste unter der jQuery-Plugin-Community einen Brand aus, indem es viele Entwickler dazu anregte, ihren Seiten-Tabbing-Effekt neu zu erstellen. Außerdem haben sie einen wunderbaren Hover-Effekt auf die im Header befindlichen Links.

    Besucherseite

  • Clark Lab Fading-Effekt

    ClarkLab ist ein bekannter und sehr erfolgreicher Autor bei ThemeForest. Wenn Sie sein Portfolio unten besuchen, werden Sie bemerken, dass die großen Kopfzeilenbilder schließlich zum nächsten übergehen und alle ihre neuesten Arbeiten zeigen. Der Fade-Effekt ist so gut und subtil, dass das neue Bild kaum zu sehen ist.

    Besucherseite

  • Rob Young | E ist für Anstrengung

    Der Designer und Art Director Rob Young nutzte eine einzigartige Idee, um sein Kunstwerk auf einem simulierten Mac-Bildschirm anzuzeigen. Wenn Sie dann die jQuery-Bildlaufeffekte verwenden, wird jede neue Seite in die Seitenansicht verschoben, als ob sie auf einem Computer geladen würde.

    Besucherseite

  • Web Designer Wall

    WDW ist nicht nur eine visuell beeindruckende Website, sondern bietet auch ein einzigartiges benutzerdefiniertes jQuery-Skript, mit dem Sie bestimmten Elementen im Schwebeflug Klassen hinzufügen können. Schauen Sie sich die Effekte an, wenn die RSS- und Navigationselemente überfahren werden.

    Besucherseite

  • Junaid W. Hanif

    Ein weiterer wirklich cooler Tabbing-Effekt - anstelle von Pfeilen wird jedoch Paginierung und AJAX verwendet, um ein schlankes und sauberes Benutzererlebnis zu schaffen. Außerdem hat die Navigation einen sehr schönen, wenn auch einfachen Effekt.

    Besucherseite

  • KomodoMedia

    Ich habe meine absolute Lieblingsseite zum Schluss gespeichert. Sehen Sie sich zuerst dieses Design an, es ist wunderbar einzigartig und beruhigend. Mit einem der kreativsten jQuery-Skripts, die ich je gesehen habe, verfügt KM über einen Schieberegler "Laub-O-Meter". Der Schieberegler erhöht oder verringert das Laub und Design des Designs, je nachdem, in welche Richtung der Schieberegler verschoben wird. Für ein Osterei sollten Sie unbedingt den Quellcode lesen!

    Besucherseite

Denken Sie daran, dass jQuery nur ein Werkzeug ist und nur durch Ihre Kreativität und Ihr Können begrenzt ist. Machen Sie sich mit Ihren Entwürfen und Ihrem Entwicklungsprozess einzigartig und Sie werden überrascht sein, dass großartige Ergebnisse erzielt werden. Vergewissern Sie sich, dass Sie Ihre Lieblingswebseiten mit einzigartigen Verwendungsmöglichkeiten von jQuery im Kommentarbereich weitergeben! … Und ein Digg oder Stolpern wäre sehr dankbar! :)

  • Abonnieren Sie den NETTUTS-RSS-Feed für mehr tägliche Webentwicklungsberichte und -artikel.