昨年からいろんなサイトで続々と実装されてきているFlexbox。従来の方法とは違い、簡単にCSSでレイアウトを組めちゃう素敵技です。しかし、Internet Explorer8や9等の古いブラウザーには対応しておらず、Flexboxを使いたくても使えない…というWeb制作者さんも少なくないはず。そんな悩みを今回の記事で解消します！
続きを読む

近頃Webデザインのギャラリーサイトで見かける素敵Webサイトって、どれもアニメーションなどのエフェクトがかっこいいですよね。という事で今回は、中でも簡単に実装できそうな効果をひとつ。スクロールすることで要素が可視範囲に表示されると、CSS3のアニメーションを使ったエフェクトが実行される、というのを実装してみようと思います。なんだか難しそう…と、食わず嫌いでいた人でも、基本さえおさえておけば、あとはアイデア次第で自分好みにカスタマイズできると思いますよ！
続きを読む

近年デスクトップ版のWebサイトでは、様々な動きをつけたエフェクトをよく見かけます。以前このブログで背景に動画を使ったWebサイトの作り方を紹介しましたが、今回はWebGL、JavaScriptなどで作られたアニメーションをメインに利用しているWebサイトを中心に紹介します。
続きを読む

Adobe社のEdge Animateというツールを聞いたことはありますか？クリエイティブ クラウドのメンバー登録をしている人は、「聞いたことあるけど、何するツール？」という方もいるかと思います（私もそうでした…）。Edge AnimateはアニメーションやインタラクティブなコンテンツをFlash感覚で作成できるツールです。簡単な使い方を、サンプルも交えて紹介します！
続きを読む

マウスウィール（トラックパッド）でスクロールすると前後の画像が見れるギャラリー。一目見て「おっ、iTunesだ！」と思いました！JavaScriptとCSSをカスタマイズすればサイトにあった表現の仕方ができます。デフォルトでも充分かっこいいので「JavaScriptはよくわからない..」という人でも簡単に実装できると思います！

続きを読む