hideout-lastation.com
Paradis Pour Les Concepteurs Et Les Développeurs


Comment développer une miniature comme Google Images

Google Images exécute une interface utilisateur unique avec des aperçus miniatures provenant de nombreux sites Web différents . En cliquant sur l'une de ces vignettes, l'écran affiche plus de détails et une image plus grande.

C'est l'une des meilleures fonctionnalités de galerie d'images que j'ai utilisées et maintenant, vous pouvez la cloner avec Gridder.js .

Ce plugin jQuery gratuit suit les traces de l'incroyable UX de Google en créant un plugin qui correspond à cet effet. Vous pouvez transformer n'importe quelle galerie de photos en une galerie de style Google Images avec toutes les mêmes animations et fonctions d'affichage.

Je suis agréablement surpris par la rapidité et la facilité d'utilisation de ce plugin. Le simple fait de cliquer sur une vignette affiche immédiatement une image plus grande et les animations sont super propres.

Les images comprennent une section pour le texte descriptif au cas où vous souhaitez ajouter des détails ou des liens liés aux photos. Cela fonctionne particulièrement bien pour les sites de portefeuille simples avec un objectif de se concentrer sur les images.

En plus de cela, vous pouvez également tirer du contenu via Ajax . Cela vous permet de créer des miniatures dynamiques qui extraient le contenu d'autres sites Web ou via des API.

Chaque événement click offre une méthode de rappel, ce qui vous permet d'exécuter d'autres plugins ou fonctions JavaScript avec Gridder. Avec autant d'options, cela ressemble pratiquement à un cadre de grille entier!

Comme Gridder s'exécute sur jQuery, il nécessite la version la plus récente en tant que dépendance. Mais, c'est tout ce dont vous avez besoin (avec le fichier Gridder.js), et avec quelques lignes de HTML, vous pouvez faire fonctionner votre grille en douceur.

Vous devriez consulter la page GitHub pour les instructions d'installation complètes, mais voici un aperçu rapide de ce à quoi ressemble le HTML:

Le contenu va ici ...

Tout le contenu est tiré par JavaScript, de sorte que vous pouvez charger à peu près tout ce que vous voulez.

C'est un plugin incroyablement polyvalent avec des options pour changer la vitesse de l'animation, l'assouplissement, le style du bouton de fermeture et la position du décalage de défilement lorsque l'utilisateur clique sur une nouvelle vignette.

Les développeurs débutants et professionnels trouveront beaucoup de valeur dans ce plugin. Pourtant, si vous ne savez toujours pas si c'est pour vous jeter un oeil à la page de démonstration Gridder en direct et jouer.

20 cadeaux que les développeurs Web aimeraient obtenir

20 cadeaux que les développeurs Web aimeraient obtenir

Noël et 2015 sont juste au coin de la rue et la saison des fêtes approche! C'est le moment de se détacher de l'agitation du travail, de réduire le stress et, surtout , de s'amuser en famille et entre amis, d'échanger des cadeaux et des plaisanteries joyeuses .Si vous avez du mal à penser à un cadeau pour un développeur Web, alors cette liste est pour vous. J'

(Conseils techniques et de conception)

React.js: 14 Outils et ressources pour les développeurs Web

React.js: 14 Outils et ressources pour les développeurs Web

La popularité de React.js a connu une croissance rapide depuis que Facebook a sorti la bibliothèque en 2013. C'est le cinquième projet open source le plus fréquemment publié sur Github, et les annonces d'emploi pour les développeurs de React sont également en forte augmentation. React est un framework JavaScript léger pour construire des interfaces utilisateur - les exemples les plus marquants sont Facebook et Instagram.React o

(Conseils techniques et de conception)