Eye Droppin & # 039;

Le navigateur Chrome et les navigateurs connexes ont ajouté une API de page Web appelée EyeDropper , permettant aux développeurs Web d'obtenir facilement des valeurs de couleur à n'importe quel endroit à l'écran.

L'extrait de code suivant montre comment utiliser l'API:

 if ('Eyedropper' dans la fenêtre) {
  const EyedRopper = new EyeDropper ();
  essayer {
    // Cela nécessite l'interaction utilisateur pour déclencher le résultat const = attendre eyedropper.open ();
    const ColorhexValue = result.srgBHEx;
  } catch (err) {
    // L'utilisateur annule le ramassage des couleurs}
}

Cette API ne prend actuellement en charge que Chrome et les navigateurs connexes. Le processus de développement a commencé avec Edge Browser, et a été discuté et examiné plus tard par le groupe communautaire et finalement lancé dans Chrome. Bien que Chrome joue un rôle de premier plan dans le processus, dans l'ensemble, il s'agit d'un cas positif, d'autant plus que EyeDropper sont une caractéristique relativement mineure.

L'avantage de EyeDropper est qu'il peut ramasser les couleurs de l'ensemble de l'écran, ce qui améliorera considérablement l'expérience utilisateur des outils de conception tels que Figma, compensant les lacunes de ses micros de couleur limités à la toile. Des applications telles que Slides.com et Polypane ont appliqué l'API aux environnements de production, améliorant l'expérience utilisateur. De plus, des extensions et des signets chromés correspondants sont également apparus.

Il est recommandé de fournir un bouton de sélecteur de couleurs système accessible tout en utilisant EyeDropper pour améliorer l'expérience utilisateur et obtenir une amélioration progressive. Cela peut être développé en tant que composant Web autonome.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!