＜ねくすと☆辞典＞　　　パソコン編 【WEB】3



ＪＡＶＡリプト研究室
ＷＥＢ＆ＨＰ


JAVAスクリプト（のコピペｗ）を実践していこうというページです。
望みの効果を得るには、たとえコピペでもそれなりの労力が必要なのですよ！ｗ

JAVAスクリプトを書く上で困ったことなど。もちろん、ド素人向けですｗ

※JAVAリプト＝JAVAscriptの意（私が勝手に造った造語です）


＜メニュー＞

●プルダウンメニュー（セレクトメニュー）　 ●複数の記述/実行(?)





【プルダウンメニュー】〜ターゲットは君だ！〜　の巻 (セレクトメニューとも言うんですか？)

主要なコンテンツ間の移動がしたくて、プルダウンメニュー
（例：←左フレーム上部/他コンテンツに飛ぶ）を使うことにしました。
が、ターゲットを全画面（いわゆる　_top ）にできずに四苦八苦。
『プルダウンメニューのターゲット指定』　の方法を検索してみると、結構色々ありましたが
今使っているのが私にとっては一番使いやすく、わかりやすいです！

以下のスクリプトは　ミケネコ様　のHPより、そのまま引用させていただきました。
このサイト様は、使いやすくしかも上級なスクリプトが満載　なうえに　改変や転載などを許可なされています！敬服!!

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>プルダウンのリンクリスト</title>
<script type="text/javascript">
<!--
//------------------------------------------------------
//モード0は通常　引数を渡さなければモード0
//モード1はtarget="_blank"
//モード2はtarget="_top"
//------------------------------------------------------

function pullJump(mode){
if (document.getElementById) {
url = document.getElementById("pull")[document.getElementById("pull").selectedIndex].value;
if( mode == "0" || mode == undefined) location.href = url;
if( mode == "1" ) window.open(url,'','');
if( mode == "2" ) window.parent.document.location.href = url;
}
}
//-->
</script>
</head>
<body>

<select id="pull" onChange="pullJump(2)">
<option selected>　</option>
<option value="index.html">トップページへ</option>
<option value="info.html">インフォメーションへ</option>
<option value="diary.html">日記へ</option>
<option value="link.html">リンク集へ</option>
</select>

</body>
</html>

このスクリプトのおかげで、フレームページでも気軽にプルダウンメニューを使用することが出来ました〜♪
もちろん、フレーム以外にも使い道はたくさんありますね！

上へ




【2つ以上（複数）のスクリプトを実行（?）】〜どう表現したらいいかわからない〜　の巻

どう説明したらいいのか分からないので、私自身の具体例を挙げます。

ま、ネタばらし（?）になりますが、近々次回作ゲームの途中発表みたいなのをやろうとしてまして。（06/11/7現在）
そのキャラ紹介を《KEY公式ページ風》にしたいと。
最初はフラッシュでやるつもりだったんですが、やはり色々融通が利くので普通にHTML上でやろうかと。

ようするに、（なんか上の説明いらなかったな・・・；）
「マウスが重なると画像が変わる（ロールオーバー）」　と
「マウスが重なると画像の重なり順が変わる」　を同時にひとつの画像に対してやりたい
というわけだったんです。つまりは、「onMouseover」ではじまる命令を2つ実行したかったと。

こんなことは初歩の初歩の初歩なんだろうなぁ〜と思いつつも、
質問の仕方すらわからんことをやろうとするな　という言葉を呑み込んで、　さて検索に取掛かったわけです。

＜Let's検索＞
---------------------------
●はじめは、「同時に実行」などで検索していて
ヒットしたものが本の紹介だったりしたんで、　あ　こりゃそ〜と〜ムズイ技術ナノデワ?　とか思い込んだり。
（なんか別の、もっと複雑な技術だったのでしょう・・・。）

●お次に、「functionがどうたらで〜」　という記事を見つけたので試したところうまくいかず。
それもそのはず。そこはお馴染み(?)、最低限の知識をもっている人達の住処だったわけです。

やりたいことも似ていたのでワ〜イと飛びつき、とりあえず目に入ったスクリプトをコピペ！
「最低限の部分」がない私のスクリプトはエラーだらけでした。エラーの意味を検索するのもつかれました。
（ちゃんと勉強していれば、この時点で解決していたハズです。）
------------------------------

さて、レディース＆ジェントルメン〜！　そしてとうとう見つけました！
ご存知、「とほほのWWW入門」様　（http://www.tohoho-web.com/）のQ&Aにて！

ようするに私は

onMouseover="this.src='画像.gif'"　と　onMouseover="this.style.zIndex=数字"

というように、「onMouse」に対して複数の命令を出したかった　と。
（青色部分はonMouseoverでなくても良い。同じものということ。この部分なんて言うんです?属性とか?）
その記述がどうしていいか分からなかったのです。この場合、

属性A="○○○"　と　属性A="▽▽▽"　の記述は

属性A="○○○;▽▽▽"

のように　「；（セミコロン）」　で区切る

とすれば良かったんですね。
試しにつくったテストページを是非ご覧下さい！ね？成功してるでしょ！？（ほとんどアホ）

ちなみに、画像を重ねるのは style という別の属性なので普通に並べて記述してOKでした！
え？分かってる??　いや、置いてかないでください。

今回はホンット勉強になりました。m(_ _)m

上へ









ＴＯＰ　OCEANTOP