[Recommandé] 17 bibliothèques d'effets spéciaux d'image pour améliorer l'expérience utilisateur

1.imagehover

Adresse : https://github.com/ciar4n/imagehover.css

imagehover. css - Bibliothèque d'animation d'effets de souris sur image CSS3 pure, 44 types d'effets de souris

2. ://github.com/codrops/ImageTiltEffect

TiltEffect est un plug-in qui permet aux images de suivre la souris pour produire un subtil effet d'inclinaison tridimensionnelle, lui donnant une impression de superposition et de profondeur.

3.Magnifier.js

Adresse : https://github.com/mark-rolich/Magnifier.js

Magnifier est un plug-in de loupe d'image pratique réalisé en pur js. Il possède les fonctionnalités suivantes :

Vous pouvez utiliser la molette de la souris pour zoomer et dézoomer sur l'image.

• Les options peuvent être définies via js ou des attributs de données.

• Plusieurs photos peuvent être jointes à un seul appel.

• Les utilisateurs peuvent personnaliser les événements d'entrée, de départ et de mouvement de la souris.

• Le texte d'attente peut être affiché lors du chargement de grandes images.

4.gl-react-image-effects

Adresse : https://github. com/gre/gl-react-image-effects

Universel avec exemple d'application et Web React. Les implémentations iOS et Android exécutent ensemble une base de code (certains codes spécifiques sont conçus pour créer différentes interfaces utilisateur sur la plateforme).

5.StickyImageEffect

Diaporama inspiré du site Web ultanoir, avec effets d'image collants.

Adresse : https://github.com/Anemolo/StickyImageEffect

6.HeatDistortionEffect

WebGL Effet de distorsion thermique sur fond plein écran.

Adresse : https://github.com/lbebber/HeatDistortionEffect

7.ImageDraggingEffects

Utiliser Un ensemble intéressant d'effets de glissement définis pour les images utilisant diverses techniques.

Adresse : https://github.com/codrops/ImageDraggingEffects

8.jQuery.BgSwitcher

jQuery.BgSwitcher implémente l'effet de changement d'image d'arrière-plan.

Adresse : https://github.com/rewish/jquery-bgswitcher

9.FullImageReveal

Un affichage d'image complète avec un bel effet de glissement de vignettes.

Adresse : https://github.com/codrops/FullImageReveal

10.diaporama

Diaporama est un moteur de diaporama d'images/vidéos/contenu qui fournit des effets d'animation de haute qualité, notamment des effets Kenburns et des transitions GLSL.

Adresse : https://github.com/gre/diaporama

11. FollowCursor

Image La rotation change à mesure que le curseur se déplace.

Adresse : https://github.com/bersLucas/FollowCursor

12.react-native-kenburns-view

Effets d'image KenBurns pour les applications React Native

Adresse : https://github.com/nHiRanZ/react-native-kenburns-view

13.vintageJS

VINTAGEJS est un plug-in jQuery qui utilise un canevas HTML5 pour ajouter de superbes effets vintage à vos images/photos. Il est livré avec trois effets prédéfinis et peut être facilement personnalisé.

Adresse : https://github.com/lindelof/awesome-web-effect

14.ThumbnailGridExpandingPreview

Tutoriel sur la façon de créer une grille de vignettes avec un aperçu d'image étendu, similaire à ce que vous voyez sur l'effet Google Images.

Adresse : https://tympanus.net/Tutorials/ThumbnailGridExpandingPreview/

15.gridder

Un plugin jQuery qui affiche un aperçu étendu de la grille de vignettes, similaire à l'effet observé sur Google Images.

Adresse : https://github.com/oriongunning/gridder

16.MotionTransitionEffect

Image Effets de transition de mouvement rapide pour les diapositives.

Adresse : https://github.com/codrops/MotionTransitionEffect

17.tiltedpage_scroll

tiltedpage_scroll .js est un plug-in qui prend en charge le défilement de la souris et la définition des angles d'image. Lorsque la page défile, l'image aura un effet 3D incliné, ce qui est un bon choix pour l'affichage du produit.

Adresse : http://peachananr.github.io/tiltedpage_scroll/demo/tiltedpage_scroll_demo.html

Les bugs qui peuvent exister après le déploiement du code ne peuvent pas être réels -time Comme vous le savez, afin de résoudre ces bugs par la suite, j'ai passé beaucoup de temps sur le débogage des journaux. D'ailleurs, je voudrais recommander Fundebug, un outil de surveillance des BUG utile (Adresse : https://www.fundebug. .com/?utm_source=xiaozhi).

Texte original : https://github.com/lindelof/awesome-web-effect