Pointer Pointerの仕組み
Jonathan Puckeyが作ったPointer Pointerというサイトがある。話題になったので見た人も多いと思うが、マウスを置くとそこを指差した写真が…
javascript
バックリンク
検索結果
Photoshopのテキストを全てシェイプに変換するスクリプト
Photoshopで作成して納品したデザインデータを、「こちらで調整ができるように文字をシェイプにして渡して欲しい」と言われ、本来であれば小さな変更でもこちらを…
Sketchで作ったデータをPhotoshopに移動させる
Sketchを使っているのが自分だけで、他の人が開けないのでPhotoshopに移動させたい。編集できる必要はなくて、各オブジェクトのサイズや位置などが分かるリ…
stonewall開発日記14
自分でレイアウトのスタイルを定義して差し替えられる仕組みを追加してタグv1.0.0つけた。レイアウトのスタイルと言っても普通にJavaScriptで関数を書く必…
stonewall.js開発日記1
唐突ですが何かしら継続して勉強していけるものを作ろうと思ったので、高さの違う要素を敷き詰めて並べてくれるJavaScriptのライブラリを作ろうと思います。そう…
stonewall.js開発日記2
まず、どういう風に使いたいかというのを考えたのだけど、jQuery Masonryを参考にしてみる。 という感じで、グリッド表示したい要素に対して、Option…
stonewall開発日記3
もたもたしているうちにVanilla MesonryというjQuery非依存のライブラリが出来てしまっていた。僕のは最終的なイメージがまだ固まっていないのだけど…
stonewall開発日記4
buildという関数にレイアウト用のオブジェクトを渡すようにした。DOM操作が必要となるので、テストにダミーのHTMLが必要になるのだけど、QUnitではテスト…
stonewall開発日記5
コンストラクタ関数を使ってStonewallオブジェクトとして利用できるように変更。設定をbuildに渡してるけどこれもコンストラクタの引数に移動するつもり。 …
stonewall開発日記6
縦方向の並びもテスト書いて通した。element.style.heightで要素の高さを取得しようとしていたのが間違いで、element.offsetHeigh…
stonewall開発日記13
前回作ったaddとremoveメソッドをpushとpopに名前を変えて、新たにaddとremoveを実装し直した。 addは配列の任意の位置にオブジェクトを追加…
stonewall開発日記12
前回の投稿を踏まえて、大きくリファクタリングした。変更点としては、 レイアウト対象の要素を配列からオブジェクトにし、位置やサイズを持たせるようにした。 位置とサ…
stonewall開発日記11
exampleを改修してLoadNextボタンを押すと継ぎ足しできるようにした。今のexampleの処理の流れは LoadNextをクリックする Tumblrか…
CSS3のbackground-sizeプロパティを試す
CSS3で追加されたbackground-sizeプロパティに、contentかcoverを指定すると画像をウィンドウいっぱいに表示してくれるので、写真をでかく…
stonewall開発日記10
リサイズイベントによって再度グリッドの引き直しをするためにコンストラクタから処理を分離した。で例によってTumblrから画像を引っ張ってくるサンプルをアップデー…
TumblrのAPIから画像を取得して表示するサンプルをアップデート
stonewallのexampleとしてTumblrからJSONPで画像URLを取得して表示するコードをgithubにアップしたけど、実際に動いているものもアッ…
stonewall開発日記7 Tumblr APIからJSONPを取得して画像を並べるサンプル
一通りできたので動作確認用にサンプルを作った。こういうグリッドで並べるようなレイアウトはtumblrやってる人ならだいたい好きだと思うからtumblrのAPIを…
GIF STREAM
kkosugeさんのサイトがすごく面白かったので、node.jsがちょっと追っていない間にバージョンが上がりまくってたのと、WebSocketに対する興味からこ…
JavaScriptでSine Waveを鳴らす
連休中に色々と調べものしてて、dsp.jsというライブラリを見つけたので使ってみた。Chrome14でしか動作確認してない。Git覚えたくてgithubに上げた…
YouTuBJ
結構前にYouTubeでミックスできるの作りました。YouTuBJわかりにくいけど黄色いエリアの上に入力フォームがあるのでそこから検索するかIDを入れると読み込…
BEAM
BEAMCGIとかJavaScriptの勉強しつつ触っている間に何かアイディアが出ないかなと思って自分用の画像スクラップを作った。FFFFound!やTumbl…
レイヤーカンプからWeb用のJPEGに書き出すJavaScript
Webデザイン(ワイヤーフレームから絵を起こす作業)はPhotoshopで常人の理解を超える数のレイヤーを駆使して行われます。そしてそれをコーダーと呼ばれる人達…
sketch20081012
ドキュメントの左下(0, 0)から選択したオブジェクトのパスにアンカーポイントを追加して線を引く。curvesToPoints()の第二引数がよくわからない。
scriptographer Timer class
Helpより。1秒毎に円を描いてx位置が500pixelを超えたら止まる。timerTest.js