2013-05-03

ドット絵でパララックス効果

トップページでトップ絵に採用してみましたが、ドット絵でパララックス効果をやってみました。

2013-04-29

JSでドット絵にTIPを表示するライブラリを作った

先日作ったJSでパレットを読み出すPixelUtil に、画像のjQueryオブジェクトを引数で渡すとTipを表示してくれるcreateTip関数を追加しました。引き続き、Githubにて公開しています。 Firefoxで完全に動き、Chromeだと拡大時に縁がボケ、IEだとパレットがバグります。改変･使用は自由ですが、バグがあったら教えて欲しいです。

2013-04-28

ドット絵にマウスオーバーでパレットを表示するようにしてみた

JavaScript ドット絵プログラミング

昨日の記事の使用例として、ここのギャラリーでドット絵にマウスオーバーするとパレットを表示するようにしてみました。

2013-04-27

JavaScriptで画像のパレット他を読み出すコードを書いた

JavaScript ドット絵プログラミング

Githubにて公開しています。 256色Png、普通のGifと簡単なアニメーションGifに対応しているつもり。IEでは動きません。改変･使用は自由ですが、バグがあったら教えて欲しいです。

2013-04-14

JavaScriptのthisの出現パターンは2つしか無いという話

JavaScript プログラミング

前にJavaScript初心者向けにthisについて言及しました。当時わかりやすく書いたつもりだったけど、今読み直すとわかりづらい･･･ので、視点を変えて書きなおしてみようという試み。

2013-01-28

PHPのdate関数みたいなのをJavaScriptで

JavaScript プログラミング

とりあえずY,m,d,H,i,sだけ使いたかったので、適当に実装してみた。もっと綺麗な方法はいくらでもあるとおもう。

Date.prototype.format = function(formatStr) {
  var d=this, a = {
    Y:d.getFullYear,
    m:function(){return ('0'+(d.getMonth()+1)).slice(-2);},
    d:function(){return ('0'+d.getDate()).slice(-2);},
    H:function(){return ('0'+d.getHours()).slice(-2);},
    i:function(){return ('0'+d.getMinutes()).slice(-2);},
    s:function(){return ('0'+d.getSeconds()).slice(-2);}
  };
  return formatStr.replace(/[YmdHis]/g, function(l) {return a[l].apply(d);});
};

使用例は次のようなかんじ

new Date('2013-1-28 9:30:28').format('Y/m/d H-i-s');
// "2013/01/28 09-30-28"

2012-11-28

JavaScriptでcookieの値を取得

JavaScript プログラミング

ぐぐるとわざわざsplitしてforで回してる冗長なコードが出てきたりするので、適当に書いたコードだけど覚え書き。 keyに対する値があればその値を、なければfalseを返す関数。

var getCookieValue = function(key) {
    var val = document.cookie.match(new RegExp('(^|\\s)'+key+'=([^;]+)'));
    return !!val && unescape(val[2]);
};