web,direction,planning,graphicdesign

2009年3月9日月曜日

scriptaculousのmorphエフェクト

$("contents").observe("click", morphEffect);
var bigOrSmall = true;
function morphEffect (e) {
e.stop();
var target = e.currentTarget;

if (bigOrSmall) {
// large
target.morph({width:"300px", height:"300px",backgroundColor:"#ddf",color:"#009",borderColor:"#f00"},{duration:3});
//bigOrSmall = false;
} else {
// small
target.morph({width:"200px", height:"100px",backgroundColor:"#fff",color:"#000",borderColor:"#f63"},{duration:3});
//bigOrSmall = true;
}
// フラッグ反転 true <-> falseを入替え
bigOrSmall = !bigOrSmall;
}

フォロワー