Share
Il y a eu beaucoup de messages sur le nombre de plugins jQuery impressionnants et où les trouver. Cependant, il est parfois préférable de ne pas compter sur des plugins et des ressources tiers. Faites-le vous-même à l'ancienne! Aujourd'hui, nous examinerons plus de 20 utilisations créatives de jQuery dans les sites Web et les applications modernes; sûr de vous inspirer pour votre prochain projet.
Un de nos écrivains sporadiques, James Padolsey, a une fonctionnalité intéressante sur son site Web. Une barre de personnalisation dans la partie supérieure droite de l'écran vous permet de changer la couleur de fond de l'en-tête..
Visitez le site
Ces gars sont à peu près des dieux de la conception web, et leur site le prouve vraiment. Jetez un coup d’œil à la navigation personnalisée jQuery qu’ils utilisaient sur leur page d’accueil. Avez-vous déjà vu une navigation aussi sexy dans votre vie?
Visitez le site
FamFamFam avait besoin d'une lightbox personnalisée comme un script pour FamSpam (ouf, dis-le trois fois). Ils ont fini par créer ce que l'on appelle maintenant FaceBox, qui reproduit les effets de la lightbox, mais va au-delà en vous permettant de charger des pages HTML statiques, des formulaires de contact, tout ce que vous souhaitez vraiment! FaceBox est maintenant un plugin jQuery après toute la demande pour leur script.
Visitez le site
Au lieu d’utiliser un menu flash / menu de contrôle typique, Grooveshark l’a mélangé un peu et a créé un script jQuery personnalisé pour vous permettre de créer vos propres widgets musicaux. plutôt chouette.
Visitez le site
CSS-Tricks, de Chris Coyier, est le suivant sur la liste avec une navigation jQuery merveilleusement simple et créative. Lorsque les liens sont survolés, au lieu de changer immédiatement de couleur, jQuery est utilisé pour aider la couleur à se fondre lentement vers la couleur souhaitée..
Visitez le site
Le développeur David Walsh de DavidWalsh.name implémente un script extrêmement simple à utiliser pour donner un petit coup de pouce à vos liens. Le script utilise les capacités d'animation puissantes de jQuery déclenchées en survol. Consultez les liens dans la barre latérale et dans le pied de page pour voir l'effet en action..
Visitez le site
Si vous consultez le site Web CarrotCreative, vous remarquerez en fait deux effets jQuery vraiment uniques. Premièrement, si vous cliquez sur des sites en haut à gauche, vous verrez une application unique d’effet de type «visionneuse» listant leurs sites et leurs icônes. Deuxièmement, si vous cliquez sur l'un des liens de navigation, vous remarquerez qu'il n'y a pas d'actualisation, mais que la nouvelle page se glisse dans la droite. Truc cool!
Visitez le site
Autre nouveauté "deux pour un", Bright Creative utilise une navigation extrêmement calme et chaleureuse dans sa navigation. En outre, toutes les pages de leur portefeuille ont un effet de tabulation, il n'est donc pas nécessaire que l'utilisateur actualise la page à chaque fois, grâce à AJAX et jQuery..
Visitez le site
Il n'y a pas si longtemps, Connor Zwick nous a écrit un bon tutoriel qui explique exactement comment créer un formulaire de connexion par liste déroulante incroyable..
Visitez le site
Ce serait une insulte d'appeler cela un type de "chapiteau" (des frissons qui prononcent ce mot). Au lieu de cela, Aviary a mis au point un très beau "scroller" fonctionnel pour présenter beaucoup de texte dans un espace réduit. Encore mieux est que la molette se dégrade gracieusement si javascript est désactivé.
Visitez le site
DesignFlavr, connu pour ses excellentes sources d’inspiration en matière de conception, a créé un simple script fadeIn / fadeOut pour mettre en valeur leurs illustrations et leurs descriptions. En outre, ils ont très bien utilisé le plugin lavalamp dans leur navigation principale.
Visitez le site
Sur la page d'accueil de Hv-Designs, vous remarquerez que l'icône RSS commence par un contour / croquis de l'image réelle. Puis, lorsque survolé, les icônes RSS «brille» en place.
Visitez le site
En plus d'être un site Web absolument hilarant, Asylum possède son propre script de défilement 'articles vedettes'. Il est difficile de dire pourquoi celui-ci est si agréable, mais c'est probablement parce qu'il se comporte légèrement différemment de la plupart des scripts de défilement. Il semble presque se mettre en place après avoir cliqué dessus.
Visitez le site
Brian Reindel a créé une page Web présentant 5 scripts personnalisés que vous pouvez utiliser à votre guise. L'article reprend les idées et les techniques javascript antérieures fréquemment utilisées et utilise jQuery pour les rendre puissantes, compactes et faciles à lire..
Visitez le site
Coda est bien connue pour son interface utilisateur et sa conception de site étonnantes. Cela a mis le feu à la communauté des plugins jQuery en incitant de nombreux développeurs à recréer leur effet de tabulation de page. En outre, ils ont un effet de survol merveilleux sur les liens situés dans l'en-tête..
Visitez le site
ClarkLab est un auteur connu et très réussi sur ThemeForest. Si vous visitez son portfolio ci-dessous, vous remarquerez que les images d'en-tête de grande taille finissent par disparaître progressivement, illustrant tous ses derniers travaux. L'effet de fondu est si bien fait et subtil, vous remarquez à peine la nouvelle image qui apparaît.
Visitez le site
Le designer et directeur artistique Rob Young a eu l’idée unique d’afficher ses œuvres sur un écran Mac simulé. Puis, à l’aide des effets de défilement jQuery, chaque nouvelle page glisse dans l’affichage de la page comme si elle était en cours de chargement sur un ordinateur..
Visitez le site
En plus d’être un site Web époustouflant, WDW propose des scripts jQuery personnalisés uniques permettant d’ajouter des classes à certains éléments en survol. Découvrez les effets lorsque les éléments rss et de navigation sont survolés.
Visitez le site
Un autre effet de tabulation vraiment cool - à la place des flèches cependant, la pagination et AJAX est utilisé pour créer une expérience utilisateur élégante et propre. De plus, la navigation a un très bel effet quoique simple.
Visitez le site
J'ai sauvegardé mon site préféré absolu pour la dernière fois. D'abord, regardez ce design, il est merveilleusement unique et réconfortant. En utilisant l'un des scripts jQuery les plus créatifs que j'aie jamais vus, KM dispose d'un curseur "feuillage-mètre" où il permet de l'augmenter ou de le réduire, en fonction du sens du déplacement du curseur. Pour un œuf de Pâques, vérifiez le code source.!
Visitez le site
Gardez à l'esprit que jQuery est simplement un outil et n'est limité que par votre créativité et votre niveau de compétence. Devenez unique avec vos conceptions et votre processus de développement et vous pourriez être surpris de voir d'excellents résultats se produire. Assurez-vous de partager l'un de vos sites Web favoris présentant des utilisations uniques de jQuery dans la section commentaires ci-dessous.! … Et un Digg ou Stumble serait grandement apprécié! :)
Accentsconagua