[B! js][css] yoiITのブックマーク

yoiIT id:yoiIT

jsとcssに関するyoiITのブックマーク (3)

簡単にリッチなチャートが作れるC3.jsを使ってみた - undefined
C3.jsとは? C3.js | D3-based reusa ble chart library C3 はチャートに特化したビジュアライゼーションライブラリです。D3 のラッパーライブラリで、D3 の見た目の美しさやインタラクション性などの特徴を残しながら、チャートライブラリとして分かりやすいインターフェースを提供するという方針で開発を進めています。 http://blog.xica-inc.com/about-xica/member-12/ これはまではhighchart.jsを使っていましたが、商用利用は有償だったりするので今回C3.jsをいじってみます。サンプルどんなチャートが作れるか以下のサンプルを見れば分かります。 C3.js | D3-based reusa ble chart library 使ってみる音ゲーなどではゲーム終了時にスコアの軌跡がグラフとして描画されたりしま
yoiIT 2015/01/19
js

JavaScript

css

グラフ

ライブラリ
リンク
[JS]jQueryのプラグイン100選 -2011年総集編
2011年に紹介したものを中心としたjQueryのプラグイン100+α選です。今年はCSS3の影響もあってかアニメーションのエフェクトが目立ちました。また、Resposive Web Design用の可変ものや動画・テキストを扱ったものも多かったですね。 [ad#ad-2] 動画関連画像ギャラリー関連画像拡大関連画像配置・キャプション関連背景画像関連コンテンツスライダー・カルーセル関連タブ関連ナビゲーション関連レイアウト関連パネル・ボックス関連ツールチップ・ティッカー関連アニメーション関連エフェクト関連スクロール操作・スクロールコンテンツ関連リスト関連テーブル関連フォーム関連テキスト関連見出し抽出関連ローディング関連エレメント・コンテンツ生成その他動画関連
yoiIT 2011/12/13
プラグイン

jquery

js

css3

css
リンク
アニメーションgifならぬアニメーションjpg/png
今日（2011/5/11）のgoogleロゴはダンスのアニメーションになってて、それがとてもキレイでかっこいいアニメーションだったので、自分もアニメーション用のjsをちょこっと書いてみた。「Google」の6文字が踊る――マーサ・グレアムさん生誕記念のホリデーロゴこの人がロゴのアニメーション作ってた人。ほんと細部までキレイなアニメーション。このアニメーターのモーション技術すっげぇ。。んで、googleロゴの中身見てみると、gifアニメかと思いきやpngのポジションをずらす方法を取っててこれがネタばらしの一枚絵。そういえば、一昨日公開された、thaのFRAMED*のページでも使われてたなぁ、これ。と思い、普通にjs書ける人には一瞬でできるだろうから関係ないけど、この1枚絵さえ作れれば、誰でもアニメーションgifならぬ、アニメーションjpgとか、アニメーションpngつくれ
yoiIT 2011/05/13
GIF

js

ロゴ

アニメ

CSS

JavaScript
リンク
1