API Polyfill Imej Responsif QA untuk Aplikasi Web Berbeza
Picturefill ialah API yang mudah digunakan, pintar dan responsif yang boleh digunakan dalam aplikasi web yang berbeza untuk memastikan pengguna melihat saiz yang betul, resolusi skrin dan banyak lagi bergantung pada peranti.
Sebagai API polyfill imej responsif, Picturefill adalah sumber terbuka dan percuma untuk digunakan serta telah dibangunkan menggunakan Javascript dan HTML. Terutamanya digunakan untuk bahagian hadapan aplikasi, ia boleh membuat tambahan yang hebat kepada mana-mana projek yang pengguna akhir mungkin mempunyai peranti yang berbeza-beza untuk mereka mengakses aplikasi itu.
Picturefill menyediakan sokongan dan ciri tambahan untuk elemen Picture dan Img dalam pelayar. Ia adalah salah satu cara paling mudah untuk memastikan bahawa tidak kira peranti mana pengguna anda mengakses tapak web anda, imej menyesuaikan secara automatik kepada saiz dan resolusi skrin mereka. Picturefill telah diuji untuk banyak penyemak imbas termasuk Safari, Internet Explorer 9, Google Chrome Mozilla Firefox dan banyak lagi.
Bermula dengan PictureFill
Cara yang disyorkan untuk memasang PictureFill melalui NPM. Sila gunakan arahan berikut untuk memasangnya.
Pasang PictureFill melalui NPM
npm install picturefillTambah Imej Responsif melalui API JavaScript Percuma
Pustaka PictureFill sumber terbuka membolehkan pembangun JavaScript menambah imej responsif pada tapak mereka, termasuk memastikan bahawa penonton dengan port pandangan kepadatan piksel tinggi boleh melihat aset resolusi tinggi dan ia melaraskan sewajarnya. Begitu juga, anda boleh menyediakan penyemak imbas dengan beberapa imej yang sama tetapi dengan saiz yang berbeza-beza. Picturefill akan menyusun dan menyediakan sumber terbaik untuk saiz port pandangan semasa pengguna anda, ketumpatan paparan dan saiz aset dalam reka letak tapak web. Picturefill juga membenarkan pembangun menentukan imej yang dipaparkan bergantung pada port pandangan pengguna. Dengan bantuan elemen gambar, anda boleh menentukan pelbagai saiz, tahap zum, nisbah bidang dsb.
Tentukan Titik Putus Imej melalui API JavaScript Percuma
Satu lagi ciri Picturefill ialah keupayaan untuk menentukan titik putus imej tertentu dengan pilihan resolusi berbeza untuk imej sumber di tapak web. Picturefill juga menyediakan pilihan untuk memutuskan imej sandaran untuk format imej yang tidak disokong pada format tertentu. Dengan cara ini tapak web anda tidak akan menunjukkan ralat paparan imej.
Sokongan Pelayar
Pustaka Picturefill sumber terbuka telah menyediakan sokongan lengkap untuk pelbagai jenis pelayar. Pustaka diuji dan berfungsi dengan lancar pada sejumlah besar penyemak imbas, seperti Firefox, Google Chrome, Internet Explorer, Safari, Opera dan banyak lagi. Apabila JavaScript dilumpuhkan, penyemak imbas boleh melihat teks atribut alt sebagai sandaran. Perpustakaan telah menyertakan sokongan penuh untuk IE9 dan juga versi yang lebih lama. Untuk IE9 & kemudian, anda perlu membalut pembalut elemen video di sekeliling elemen sumber dalam tag gambar anda. Contoh berikut menunjukkan cara melakukannya.
