6 |
表示 |
6 |
背景を切り替えよう |
今回は背景を入れ替える命令をやってみよう。
JavaScriptでも背景の色を変えることは出来たね。でも背景の画像を変えることは出来なかったよね。
(※BODY内を操作することによってある程度はできる。)
DHTMLでは背景の画像も動的に変えることができるんだ。
document.body.background = "■";・・・・・背景の画像のURLを■に変える |
いままで、いろいろと指定してくるときにはidというものを使って指定してきた。
今回は背景なので、このページ自体を操作するね。
なので、今回はidの場所にdocumentというものが入るんだよ。
つまり、
document.body.background ⇒ document(ページ?)のBODYのBACKGROUND
という感じにとっておこう。
じゃあ、プログラムを作ってみよう。
| <input type="button"
value="HTMLの背景" onclick="document.body.background='../../html/image/back/back2.gif'"><p> ←それぞれの背景を指定 <input type="button" value="スタイルシートの背景" onclick="document.body.background='../../css/image/back.gif'"><p> <input type="button" value="DHTMLの背景" onclick="document.body.background='../image/dhtml_back.gif'"><p> |
これを実行すると、
↑ボタンを押してみよう背景画像が変わるよ |
ほらね、簡単に出来たでしょ。