Os GIFs animados são imagens, mas o senhor não pode realmente manipulá-los como outros tipos de imagens, como PNGs, JPEGs ou até mesmo WebPs. Os GIFs são uma espécie de arquivo de vídeo, pois têm quadros, mas não há controle real sobre como eles são reproduzidos ou em loop. Meu utilitário favorito de manipulação de imagens, o ImageMagick, não parece ser o melhor utilitário para GIFs animados – outro utilitário chamado gifsicle é tão bom quanto possível. Mostrei ao senhor como fazer mesclar e otimizar GIFs animados com o gifsicle, e agora vamos dar uma olhada no redimensionamento de GIFs animados.


Se o senhor tentar usar a funcionalidade básica de redimensionamento do ImageMagick, acabará obtendo a saída do primeiro quadro no tamanho correto. Isso é bom, mas o senhor quer manter o GIF animado, certo? Aqui estão alguns métodos fáceis para redimensionar um GIF com o gifsicle:



# Scaling of an image - 50%
gifsicle --scale 0.5 -i animation.gif > animation-smaller.gif

# Scale to a given width with unspecified height
gifsicle --resize-fit-width 300 -i animation.gif > animation-300px.gif

# Scale to a given height with unspecified width
gifsicle --resize-fit-height 100 -i animation.gif > animation-100px.gif

# Clip to size
gifsicle --resize 300x200  -i animation.gif > animation-clipped.gif


O senhor pode usar scale para dimensionar facilmente uma imagem por um determinado fator, mas o senhor também pode usar --resize-fit-height ou --resize-fit-width para dimensionar para os respectivos tamanhos. O senhor também pode recortar com --resize. A saída permanece animada e o senhor tem seu GIF animado no tamanho desejado!

  • Como usar o Dojo para cutucar links
  • CSS :target

    Um pseudo-seletor CSS interessante é :target. O pseudo-seletor de destino fornece recursos de estilo para um elemento cujo ID corresponde ao hash do local da janela. Vamos dar uma olhada rápida em como o pseudo-seletor de destino do CSS funciona! O HTML Suponha que haja vários elementos HTML com…