Mata droppin '

Penyemak imbas Chrome dan pelayar yang berkaitan telah menambah API halaman web yang dipanggil EyeDropper , yang membolehkan pemaju web mudah mendapatkan nilai warna di mana -mana lokasi di skrin.

Coretan kod berikut menunjukkan cara menggunakan API:

 jika ('eyedropper' dalam tetingkap) {
  const eyedropper = eyedropper baru ();
  Cuba {
    // Ini memerlukan interaksi pengguna untuk mencetuskan hasil const = menunggu eyedropper.open ();
    const colorHexValue = result.srgbhex;
  } menangkap (err) {
    // Pengguna membatalkan pickup warna}
}

API ini pada masa ini hanya menyokong penyemak imbas Chrome dan yang berkaitan. Proses pembangunan bermula dengan penyemak imbas Edge, dan kemudian dibincangkan dan dikaji semula oleh kumpulan komuniti dan akhirnya dilancarkan di Chrome. Walaupun Chrome memainkan peranan utama dalam proses, secara keseluruhannya adalah kes positif, terutamanya memandangkan EyeDropper adalah ciri yang agak kecil.

Kelebihan API EyeDropper adalah bahawa ia boleh mengambil warna dari keseluruhan skrin, yang akan meningkatkan pengalaman pengguna alat reka bentuk seperti Figma, yang membentuk kekurangan warna pickupnya yang terhad kepada kanvas. Aplikasi seperti Slides.com dan Polypane telah menggunakan API untuk persekitaran pengeluaran, meningkatkan pengalaman pengguna. Di samping itu, sambungan krom dan penanda buku yang sepadan juga telah muncul.

Adalah disyorkan untuk menyediakan butang pemilih warna sistem yang boleh diakses semasa menggunakan API EyeDropper untuk meningkatkan pengalaman pengguna dan mencapai peningkatan progresif. Ini boleh dibangunkan sebagai komponen web yang berdiri sendiri.

Atas ialah kandungan terperinci Mata droppin '. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!