Lancement du défilement quand la souris passe sur la zone.
Plus la souris se rapproche des extrémités, plus la vitesse est rapide.
Le sens de défilement change quand le curseur arrive à la moitié de l'image.
Un clic sur la zone désactive / relance le défilement.
Pour l'exemple, pendant les pauses, les images deviennent des liens actifs vers une popup.
Vous trouverez ici plusieurs fonctions qui vont vous permettre de :
* Activer/désactiver un champ en cliquant sur une case à cocher
* Choisir le nombre de champs activés (les champs sont activés du 1er jusqu'à celui en face du bouton radio inclus)
* Recopier un champ dans un autre quand une case est cochée
Ce script permet d'afficher et de cacher un cadre de trois façons différentes:
en le retirant simplement du flux ,en le faisant disparaitre sans le retirer du flux, en le réduisant verticalement.
Grâce à ce plugin, jQuery très léger vous pourrez passer en douceur aux images responsive.
En effet, ce mot est très à la mode ces derniers temps dans le développement Web. Il s'agit en fait tout simplement de pouvoir adapter vos contenus en fonction de la résolution d'écran de l'utilisateur (et donc du type d'appareil avec lequel il visite votre site).
Pour se faire, ce plugin vous offre deux solutions qui sont actuellement à l'étude pour devenir le standard des images responsive : l'élément et la nouvelle balise récemment proposée .
Une mise en garde cependant : ce plugin utilise des éléments qui ne sont pas encore considérés comme valide par le w3c !
Ce plugin jQuery présente un agréable effet de loupe sur les images selon les mouvements de la souris. L'image de « zoom » est séparée, ce qui vous permet de créer des effets.
Parmi les options que vous pouvez manipuler, il y a la taille de la loupe, une paramétrisation CSS, la gestion d'événements, etc.
CreateJS est une suite JavaScript comprenant un ensemble de bibliothèque et d'outils pour travailler avec l'HTML5.
Elle permet notamment de :
- travailler avec une API audio pour les sons ;
- travailler avec les canvas HTML5 ;
- animer les éléments HTML5 ;
- précharger les éléments.
Suite à cette discussion, je me suis amusé à réaliser un script assez simple de fondu enchainé.
Le fonctionnement est plutôt simple (enfin... je pense) : vous positionnez vos images les unes par-dessus les autres (dans l'exemple, en les positionnant en absolute) et vous lancez le script en passant en paramètre le nom de classe CSS des élément à enchainer.
Ensuite, le script modifie les propriétés z-index et d'opacité pour réaliser l'effet.
Le code est disponible sous deux formats différents (la version Gzipped n'est plus recommandée par jQuery) :
1. Compressé (minified, abbréviation min) (réduction de la taille du code).
2. Non compressé (normal) (pour les développeurs de jQuery ou pour approfondir la recherche de bugs).
Dans cet exemple, la page qui recevra le formulaire est en php, d'ou l'utilisation des "[]" dans le "name" du champ file.
Selon le langage serveur utilisé il ne faudra peut etre pas les mettre.
Windy permet de faire défiler rapidement des éléments. L'effet fera s'envoler les éléments comme un jeu de cartes ou des feuilles qui, pris dans un coup de vent, s'envolent. D'où le nom du plugin. Ceci est réalisé en utilisant des transformations CSS 3D et des transitions.
Il y a plusieurs options disponibles, comme la plage de propagation des éléments, la vitesse, l'ajout de navigations personnalisées, etc.
Pour les navigateurs qui ne supportent pas les transformations CSS 3D ou les transitions, il y a une navigation simple par défaut, c'est à dire faire apparaître/disparaître les éléments sans effet.
