[JS]アイデアが素晴らしい！ページにちょっとしたアクセントを加えるスクリプトのまとめ

Post on:2014年3月27日

sponsors

そのまま使ってもよし、アイデアに刺激されインスパイアされてもよし、の工夫をこらした素晴らしいアイデアのスクリプトを紹介します。

GitHubなどでよく見かけるリボンが、ぷら〜んと楽しいアニメーションでぶら下がり、更にそれを引くとコンテンツが表示されます。

縦長のコンテンツをスクロールする時にアニメーションで傾けます。
逆にスクロールすると、パースも逆になります。

コンテンツをスクロールするとスワイプのように次々にアニメーションで表示します。エフェクトもさまざまなものが用意されています。

スマフォでスクロールした時の一番上と下ではずむようなエフェクトをデスクトップでも再現させます。

コンテンツをダイナミックなアニメーションで傾けて、ナビゲーションを表示します。キャプチャの他にもさまざまなスタイルがあります。

二分割したレイアウトで、二つのコンテンツをダイナミックなアニメーションで表示します。

SVGを使ってパネルのホバー時、ボーダーにキランと光るようなかっこいいアニメーションを適用します。ちょっとSVGを使ってみたいという人にもいいかもしれません。

フォームの入力欄をフォーカス時にハイライトさせ、プレースホルダのテキストをアニメーションで消します。