昨日のエントリーに「背景色の変更の方は、関数化するとなぜか動いてくれなかった」なんて書いたけど、ちゃんと動きました。"this"を引数渡しすればいいだけだった。
ヘッダで記述する関数定義部。
function coloron(cell){
cell.style.backgroundColor="背景色";
}
function coloroff(cell){
cell.style.backgroundColor="";
}
これをtdタグに埋め込めばいい。
<td width="幅" onmouseover="coloron(this)" onmouseout="coloroff(this)">
関数化したほうがわかりやすそうだけど、面倒くさいのでそのままにする。
追記:
最初なんで関数化しようと考えたかというと、複数行が記述できるからだ。
例えばこんな関数を定義して…
function kaeru(cell){
cell.style.backgroundColor="背景色";
document.body.style.cursor = "pointer";
}
function modosu(cell){
cell.style.backgroundColor="";
document.body.style.cursor = "default";
}
tdタグに埋め込むと…
<td onmouseover="kaeru(this)" onmouseout="modosu(this)">
マウスオーバーで背景色の変更とマウスポインタの変更が同時にできる。
ただし今回の場合、マウスポインタを変更する関数は、行を意味するtrタグの方に、こんな感じで埋め込んだので、複数行を記述する必要はなかったというわけだ。yubi()、yajirusi()の内容は昨日のエントリー参照。
<tr align="center" onmouseover="yubi()" onmouseout="yajirusi()">
何度も繰り返しますが、これらはあくまで忘れちゃうので個人用メモです。検索その他で弊ブログに来られた方には、まともな書籍やサイトで勉強されることを強くお勧めします。
スポンサーリンク