hideout-lastation.com
Saisie de la couleur dominante de l'image à l'arrière-plan avec AdaptiveBackgrounds.js
Lors de la présentation de quelque chose sur le Web, certains développeurs trouvent souvent difficile de décider quels arrière-plans sont les plus adaptés à l'utilisation. Une bonne combinaison de l'arrière-plan avec le bon contenu peut affecter considérablement l'expérience de l'utilisateur. Pour certains concepteurs, ils préfèrent utiliser certaines des couleurs dominantes dans le contenu lui-même - AdaptiveBackgrounds.js peut le faire automatiquement pour vous.
AdaptiveBackgrounds.js est un plugin jQuery gratuit qui vous permet d'adapter facilement la couleur la plus dominante de votre contenu dans le cadre de l'arrière-plan. Il a été construit au dessus de RGBaster, fait par le même développeur.
Fondamentalement, c'est un plugin pour extraire la palette de couleurs d'une image pour arriver à la couleur dominante . La première fois que la page est chargée, le plugin extrait la couleur de l'image. La couleur extraite est ensuite appliquée au parent de l'image. Vous pouvez voir comment cela fonctionne dans ce gif.
(Source de l'image: AdaptiveBackgrounds.js)
Commencer
AdaptiveBackgrounds.js nécessite la bibliothèque jQuery pour fonctionner. Bien qu'il soit construit au-dessus de RGBaster, vous n'avez plus besoin de l'inclure. Vous pouvez obtenir le fichier plugin depuis sa page GitHub.
Ensuite, incluez tous les fichiers requis dans votre projet comme ceci:
Adapter la couleur dominante
Nous allons essayer cet outil, et l'utiliser pour extraire la couleur dominante de cette image Double Arch Arch par Kartik Ramanathan, puis l'appliquer à l'élément parent.
Pour que la couleur dominante soit appliquée dans un élément, vous devez placer l'image en tant qu'enfant. À l'intérieur de la balise img, donnez l'attribut data-adaptive-background, comme ceci, afin que le script puisse obtenir la couleur:
Pour plus d'exemples et de paramètres supplémentaires, vous pouvez visiter la page de documentation AdaptiveBackgrounds.js .
Pensée finale
Avec AdaptiveBackgrounds.js, vous obtiendrez seulement une couleur statique. Vous pouvez essayer de donner un peu plus de couleur à votre arrière-plan pour un résultat attrayant. Si vous le faites, consultez la page de démonstration AdaptiveBackgrounds.js pour plus d'idées.
Firefox Envoyer - Ce fichier se détruira après le téléchargement
Partage de vos fichiers en ligne est plutôt risqué ces jours-ci en raison du fait que les pirates sont capables de voler ou de dupliquer ces fichiers sans que personne ne le sache.Grâce à ces craintes, de nombreux systèmes de partage de fichiers en ligne ont depuis commencé à crypter les fichiers par mesure de précaution pour empêcher les pirates d'accéder facilement aux fichiers en question.Il n'
9 meilleurs outils pour optimiser les GIF animés
Les GIF animés, bien que fascinants et utiles pour afficher des animations, utilisent beaucoup plus de bande passante que les formats JPG, PNG et autres. Sur les sites qui affichent beaucoup de GIF, cela signifie que le temps de chargement requis est plus long, c'est-à-dire que le site semble prendre plus de temps à se charger complètement.Heu
