background-attachmentの初期値

ある漫画作品がアニメーション化するニュースを知って公式サイトを見たところ、CSS アニメーションを使い背景でロゴを動かしていました。

ページをスクロールした時にロゴが動くと認知が弱いかな、と思い Safari ブラウザの開発メニュー>インスペクタで background-attachmentfixed にしたらスッキリとした印象になりました。

参考まで、fixed に指定すると background-origin は無効になるそうです。

カウンタで番号リストを作る際にゼロから始めようとした時にも初期値の設定を知らなくて、ol {counter-reset: item -1;} で解決したことがありました。

http://hkitago.tumblr.com/post/168622042786

コードの読みやすさを考慮しても初期値は省略しない方が良いかもしれません。

参考

GIF BreweryでアニメーションGIFを作る

Tumblr で面白いアニメーションGIFがよく流れてくるのだけど、10年ほど前は Photoshop のフレームを使っていたものだが、サイズ計算と Tumblr 連携という二つの点で GIF Brewery を使ってみることにした。


TW の埋め込み表示が巧く画像を表示しないので貼付けると、このようなユーザインターフェースを持っています。

そして最初に作ってみたのはこれです。
“ 41’ PIRLO (Italy) sees an effort go off target. ” FIFA Confederations Cup Brazil 2013: Italy 4:3 (1:2) Japan – MatchCast – FIFA.com

P.S. 二つ質問です。

  1. GIFの読み方は?
  2. フリーになったピルロの後ろから猛然と追いかけてくる日本選手は?