Pagina inicial » Kit de ferramentas » Philter.js - Biblioteca de alteração de imagem livre usando filtros CSS

    Philter.js - Biblioteca de alteração de imagem livre usando filtros CSS

    Instagram é amplamente conhecida como a rede fotográfica mais popular. Ele lida com mais de 52 milhões de fotos por dia e muitas delas incluir filtros que alteram imagens imediatamente.

    Isso também é possível usando filtros CSS aplicar diretamente no navegador. Essas propriedades de filtro personalizadas têm amplo suporte em muitos navegadores e ficam ótimas.

    Com o Plugin de JavaScript do Philter, você pode dimensionar esse processo para economizar tempo e mover seu código para HTML efeitos de filtro dinâmicos.

    Ao usar este plugin, você ganha muito maior controle sobre suas imagens. Dessa forma, você pode escolher quais filtros deseja aplicar a imagens individuais e se determinados filtros devem ser alterados com base no comportamento do usuário, como pairar.

    CSS suporta transições animadas e o Philter torna esse processo muito simples. Você acabou de baixar o Philter da página inicial ou do repositório do GitHub. Uma vez que é adicionado à sua página web, você apenas adicione o código de inicialização e deixe ir.

    Aqui está um snippet de amostra do repositório do GitHub:

      

    Por padrão, você pode configurar transições e atributos de dados extras que você pode acrescentar em HTML. o url parâmetro define o caminho onde o Philter deve procurar por arquivos SVG personalizados usados ​​no processo de filtragem.

    Esses filtros extras são embalado com a biblioteca, então você não precisa editá-los. Mas, você pode movê-los ou colocá-los em uma estrutura de diretório diferente do seu arquivo atual, então essa configuração pode precisar de ser alterado.

    Agora você pode apenas adicionar filtros personalizados direito ao seu HTML elementos ou seus recipientes.

    Aqui está um exemplo simples:

     

    Você pode encontrar um lista completa de todos os filtros no GitHub, junto com um guia completo de configuração e muitas outras amostras de código.

    O Philter é um dos plugins gratuitos mais legais que existem e que ultrapassa os limites do CSS moderno. Você também pode crie seus próprios filtros Se você está disposto a cavar na base de código e mexer em torno de.

    Para um lugar simples para começar, visite a página do Philter e faça o download de uma cópia. Você pode tê-lo em funcionamento em nenhum momento.