JavaScript/サンプルコード/script.aculo.us/フェードアウト
JavaScriptのコードがHTMLを侵食していない！！！すげー
<head>
<title>fade</title>
<style type="text/css">
<!–
td{
font-size:8px;
width:15px;
height:15px;
border:1px solid #000;
}
–>
</style>
<script type="text/javascript" src="./src/prototype.js"></script>
<script type="text/javascript" src="./src/scriptaculous.js"></script>
<script type="text/javascript">
<!–
function action(element){
var closure = function(){
element.style.backgroundColor="#ccf";
new Effect.Fade(element.id, {
sfrom:1.0,
to:0.0,
delay:0,
fps:60,
duration: 1,
afterFinishInternal: function() {element.onmouseover="void(0);"}
})
}
return closure;
}
function init(){
var elements = document.getElementsByTagName("td");
for(var i = 0; i < elements.length; i++){
var tdElement = elements[i];
tdElement.onmouseover=action(tdElement);
}
}
//–>
</script>
</head>
<body onload="init();">
<table>
<tr>
<td id="t11"> </td>
<td id="t12"> </td>
<td id="t13"> </td>
<td id="t14"> </td>
<td id="t15"> </td>
<td id="t16"> </td>
</tr>
<tr>
<td id="t21"> </td>
<td id="t22"> </td>
<td id="t23"> </td>
<td id="t24"> </td>
<td id="t25"> </td>
<td id="t26"> </td>
</tr>
<tr>
<td id="t31"> </td>
<td id="t32"> </td>
<td id="t33"> </td>
<td id="t34"> </td>
<td id="t35"> </td>
<td id="t36"> </td>
</tr>
<tr>
<td id="t41"> </td>
<td id="t42"> </td>
<td id="t43"> </td>
<td id="t44"> </td>
<td id="t45"> </td>
<td id="t46"> </td>
</tr>
<tr>
<td id="t51"> </td>
<td id="t52"> </td>
<td id="t53"> </td>
<td id="t54"> </td>
<td id="t55"> </td>
<td id="t56"> </td>
</tr>
</table>
</body>
</html>
JavaScript/サンプルコード/closure
→[[JavaScript/サンプルコード/script.aculo.us/フェードアウト]]
JavaScript/ゲームを作る/横スクロールアクション/5.ミニゲームとして仕上げ
ゴール
いままでの成果をもとに、スタートとゴールを設定してミニゲーム風に完成させてみる。
今回の完成コード
コードの説明
ちょっとあとで！
ふたたび今回の完成コード
まとめ
補足・疑問
できたはいいけど、殺風景だな。
プロフィール
@hacker634
へなちょこシステムエンジニア。Java,PHP,C#,JS,Objective-C,DB,なんでも好きです。ヘビーな言語もLLも全部好き。SIer→受託屋→フリーランス→ちびっこWEB開発会社勤務（いまココ）担当は、ディレクション、アーキテクト、設計、開発、テスト、保守、研究、雑用、デザイン。つまり、なんでも屋。 Follow @hacker634-
リンク
