タグ

html5とCanvasに関するmelo1029のブックマーク (3)

  • HTML5でテキストのシャッフル演出ができるJSライブラリ「ShuffleText.js」 | ClockMaker Blog

    Flashでよく見かけるテキストシャッフル演出(文字列がランダムで切り替わる演出、正しい呼び名はわかりませんw)をHTML5で作ってみました。HTMLのタグ(pタグとか)に使うバージョンと、HTML5の新要素Canvasを使うバージョンの二種類を用意しました。 【2017年4月26日 追記】 【重要】JSライブラリーはGitHubで更新しています。使用したい方は次のGitHubのリポジトリを御覧ください。 Canvas版はCreateJS 2015年版でも動作するよう更新しました。 デモ demo (HTMLエレメント版) demo (Canvas版) ソースコードはMITライセンスで公開してしますので、個人・商用問わずご自由にお使いください。 ShuffleText.js (HTMLエレメント版) ShuffleEaselText.js (Canvas版) それでは以下で使い方を紹介して

    HTML5でテキストのシャッフル演出ができるJSライブラリ「ShuffleText.js」 | ClockMaker Blog
    melo1029
    melo1029 2012/02/08
    Flashでよく見かけるテキストシャッフル演出
  • HTML5のcanvasを使ったお絵かきツール詳説

    HTML5のcanvasを使ったお絵かきツールを勉強がてら作ってみました。下記の画像リンクをクリックすればサンプルページにジャンプします。 サンプル 以下、サンプルのHTMLJavaScript(jQuery)を使って、canvasのお絵かきツールについて解説します。 探しきれてないだけと思いますが、お絵かきツールのjQueryでの実装が見つからなかったので、自力で書いてみました。いろいろ間違ってたらすいません。 1.HTML サンプルのHTMLは次のようになっています。 <canvas width="500" height="400">お使いのブラウザはHTML5のCanvas要素に対応していません。</canvas> <ul> <li style="background-color:#000"></li> <li style="background-color:#f00"></li>

    melo1029
    melo1029 2012/01/17
    HTML5のcanvasを使ったお絵かきツール詳説
  • いろんなHTML5 canvasのフレームワークを試してみた

    TFujinami codes (jsdo.it) 珍しくというか初めてニュースクリップではなくオリジナルで書きます。 EaselJSやGuryなど幾つかのHTML5 canvasのフレームワークを試してみました。 ランダムで線、四角(長方形)、丸(楕円)を描画します。画面をクリックするとローテーションします。 コード共有サイトのjsdo.itですべて公開してあります。 - EaselJS (記事) - Gury (記事) - oCanvas (記事) jsdo.it上では動作しないのでダウンロードしてください - jCanvaScript (記事) - CasualJS (記事) 4/27追加 パフォーマンス低し、使い方が間違っている? - jCanvas (記事) 5/20追加 - Processing.js (記事) 5/24追加 - LibCanvas (記事) 6/8追加 Ell

    いろんなHTML5 canvasのフレームワークを試してみた
    melo1029
    melo1029 2011/04/22
    いろんなHTML5 canvasのフレームワーク
  • 1