Line Maker

JavaScript

アニメーションするラインを実装できる「Line Maker」

Line Makerは、いろんなアニメーションをするラインを実装することができるプラグインです。水平・垂直方向はもちろん、カラーや太さなどカスタマイズすることでさまざまなラインを表現できるのがいいですね。

Line Maker

デモ

Demo 1〜Demo 6まで、全部で6種類のデモが用意されています。Demo 1では、いくつかボタンが設置されていて、クリックすることで各ボタンに応じたアニメーションが実行されます。

ボタンは、Hide Lines、Show Lines、Animate Lines Out、Animate Lines In、Create Random Line、Create And Animate、Remove Linesの7タイプがあります。

ラインの表示や非表示、追加や削減などといった動作を確認できるようになっています。

また、そのほかのデモでは、細いラインでグリッドされたものやクールなアニメーションによるもの、滑らかな垂直アニメーションなど本格的に実装されたデモを確認できるので、気になる人はぜひ見てみてください。

かっこいいオシャレなラインのアニメーションをサイトで使いたいというときに、覚えておきたいですね。

Line Maker

関連記事

  1. JavaScript

    レスポンシブ対応で優雅なエフェクトが印象的なjQueryスライダー「Juicy Slider」

    レスポンシブに対応している軽量のjQueryスライダー「Juicy S…

  2. textfit.js

    JavaScript

    コンテナにテキストをフィットさせれるjQueryプラグイン「textfit.js」

    textfit.jsは、コンテナ内に表示するテキストをフィットさせるこ…

  3. Tiny slider
  4. Choreographer-js

    JavaScript

    多彩なCSSアニメーションを実現できる「Choreographer-js」

    Choreographer-jsは、多彩なCSSアニメーションを実現さ…

  5. photowall

    JavaScript

    Google画像検索のようにサムネイル画像をクリックするとスライド表示されるjQueryプラグイン「…

    Google画像検索のようなアニメーションを実装することができるjQu…

  6. Pushbar.js

    JavaScript

    スライドでコンテンツを引き出せる「Pushbar.js」

    Pushbar.jsはスライドでコンテンツやナビゲーションメニューを引…

最近の記事

  1. M360bt
  2. BQ-CASE/1
  3. GLOO BOX

アーカイブ

PAGE TOP