API Polyfill de imagem responsiva de controle de qualidade para diferentes aplicativos da Web
O Picturefill é uma API fácil de usar, inteligente e responsiva que pode ser usada em diferentes aplicativos da Web para garantir que os usuários vejam o tamanho certo, a resolução da tela e muito mais, dependendo do dispositivo.
Como uma API de polyfill de imagem responsiva, o Picturefill é de código aberto e de uso gratuito e foi desenvolvido usando Javascript e HTML. Usado principalmente para o front-end de aplicativos, ele pode ser um ótimo complemento para qualquer projeto em que os usuários finais possam ter vários dispositivos nos quais acessam o aplicativo.
O Picturefill fornece suporte e recursos adicionais para os elementos Picture e Img nos navegadores. É uma das maneiras mais fáceis de garantir que, independentemente de qual dispositivo seus usuários estejam acessando seu site, as imagens se ajustem automaticamente ao tamanho e à resolução da tela. O Picturefill foi testado para muitos navegadores, incluindo Safari, Internet Explorer 9, Google Chrome Mozilla Firefox e muito mais.
Introdução ao PictureFill
A maneira recomendada de instalar o PictureFill via NPM. Por favor, use o seguinte comando para instalá-lo.
Instale o PictureFill via NPM
npm install picturefillAdicione imagens responsivas por meio da API JavaScript gratuita
A biblioteca PictureFill de código aberto permite que os desenvolvedores de JavaScript adicionem imagens responsivas ao site, incluindo a garantia de que os visualizadores com viewports de alta densidade de pixels possam ver ativos de alta resolução e se ajustar de acordo. Da mesma forma, você pode fornecer ao navegador várias imagens idênticas, mas com tamanhos variados. O Picturefill classificará e fornecerá a melhor fonte para o tamanho atual da janela de visualização do usuário, a densidade de exibição e o tamanho do ativo no layout do site. O Picturefill também permite que os desenvolvedores decidam quais imagens são exibidas dependendo da janela de visualização do usuário. Com a ajuda do elemento de imagem, você pode especificar vários tamanhos, níveis de zoom, proporções, etc.
Especifique o ponto de interrupção da imagem por meio da API JavaScript gratuita
Outro recurso do Picturefill é a capacidade de definir pontos de interrupção de imagem específicos com diferentes opções de resolução para imagens de origem no site. O Picturefill também oferece a opção de decidir imagens de fallback para formatos de imagem que não são suportados em determinados formatos. Dessa forma, seu site não mostrará erros de exibição de imagens.
Suporte do navegador
A biblioteca open source Picturefill suporte completo para vários tipos de navegadores. A biblioteca é testada e funciona suavemente em um grande número de navegadores, como Firefox, Google Chrome, Internet Explorer, Safari, Opera e muito mais. Quando JavaScript está ado, o navegador pode ver o alt atributo texto como um fullback. A biblioteca incluiu suporte completo para o In9 e até mesmo a versão mais antiga. Para o In9 & mais tarde, você de enrolar um filme de elementos em torno dos elementos fonte em sua tag de imagem. O exemplo a seguir mostra como -lo.
