Prism Effect Slider

JavaScript

プリズム効果を実装することができるスライダー「Prism Effect Slider」

おもしろいスライダーがあったのでご紹介します。Prism Effect Sliderというプリズム効果を実装することができるスライダーです。デモを見れば分かると思いますが、ダイヤモンドやキューブの形をしたプリズムエフェクトがスライダーに加えられています。

Prism Effect Slider

Prism Effect Sliderの実際のデモは以下からチェックすることができます。

Prism Effect Slider

デモ

デモではダイヤモンド、トライアングル、キューブと3つの形をしたエフェクトを見ることができます。

スライドで画像を移動させてみると中央にある図形がたくさんの鏡に反射しているかのようなエフェクトになりますね。とても不思議な感じです。スライダー自体はとてもシンプルですね。

HTML5のCanvasのプロパティであるglobalCompositeOperationやJavaScriptなどが使われているとのこと。

というわけで、プリズム効果を実装できるスライダー「Prism Effect Slider」のご紹介でした。

Prism Effect Slider

1つのテキストリンクから複数のリンク先が表示される「μllinx」前のページ

ページが読み込まれるまでローディングアニメーションを表示できる「jqueryIntroLoader」次のページjqueryIntroLoader

最近の記事

  1. クリスマスブロンドロースト
  2. トマトとニンニク
  3. ウィンターホワイトマグツリー
  4. 読書の進捗状況を非表示にする
  5. 牛すじ煮込みカレーと温野菜
PAGE TOP