JavaScript Sample1

背景画像変更 文字色変更(セレクトメニュー) 文字色変更(ラジオボタン) 写真サイズの変更
アコーディオンメニュー 写真の入れ替え 写真の入れ替え(効果付)



ラジオボタンを押すと背景画像が変わります。→mjava/chBgImg.js



セレクトメニューを使った文字色変更。→mjava/chFtColor.js
--- テストの後は「black」を選択して元に戻しておいてください。----
文字色変更。


ラジオボタンーを使った文字色変更。→mjava/chFtColor_r.js
--- テストの後は「black」を選択して元に戻しておいてください。----
Black Red Blue Green
文字色変更。



写真サイズの変更。→mjava/phot_size.js
画像を指定されたサイズに変更します。






アコーディオンメニュー→src="mjava/accord.js" : href="href="css/accord.css""
メインメニュー1
メインメニュー2
メインメニュー3
メインメニュー4







写真の入れ替え。→mjava/photo_clickchange_1.js
画像をクリックすると、画像が入れ替わります。

[此処をクリックすると別ウィンドウで表示します。]




写真の入れ替え(効果付)。→mjava/photo_clickchange_2.js
画像をクリックすると、画像が入れ替わります。(変化しない時は、もう一度クリックしてください。)
transitionの数字を変えることで、様々な効果を加えることができます。
I.E以外対応していません。
1〜5

6〜10

11〜15

16〜20

21〜23





mjava/chBgImg.js function chBgImg(opt) {
document.body.style.backgroundImage = "url(" + opt.value + ")";


mjava/chFtColor.js // セレクトメニューを使った文字色の変更
function chFtColor(opt) {
document.body.style.color = opt.options[opt.selectedIndex].value;