こんにちは。あきです。
さて今日はこの折りたたみメニュー（クリックするとメニューが開きます。）
を例にJavaScriptについて学んでいきます。
アキヒロ：
「先輩。前回はバトンの解答ありがとうございます。相変わらず寂しく悲しい毎日を送っているようで。僕はうれしいです。」
先輩：
「うるさい。俺の日常に触れるなと前から言ってるだろ。
それで。今日は上記の”折りたたみメニュー”処理をを説明すればいいのか？」
アキヒロ：
「はい。お願いします。」
先輩：
「それでだ。最初にこの仕組みを明かすとこの処理は単純にサブメニューを隠して表示しているだけなのだ。」
アキヒロ：
「へー。でメインメニューをクリックするとサブメニューを表示する処理が実行されるんですね。」
折りたたみメインメニュー
・サブメニュー１
・サブメニュー２
・サブメニュー３
先輩：
「そうだ。このサブメニューを初期表示で隠すためには
<HEAD>～</HEAD>部分に以下の様な
スタイルシートを記述する。」
<style type=”text/css”>
<!–
.sub{
display : none
;}
–>
</style>
先輩：
「この記述により、初期表示時に
折りたたみメインメニュー
とメインメニューのみ表示することが可能となる。」
アキヒロ：
「はあ。」
先輩：
「そしてこれがメインメニューをクリックすると実行されるJavaScriptの処理だ。」
<script Language=”JavaScript”>
<!–
function pMenu(id)
{
var el = document.getElementById(id);
if (el.style.display=="block")
el.style.display
= ‘none’;
else
el.style.display
= ‘block’;
}
// –>
</script>
先輩：
「まあおそらく分けがわからんだろう。」
アキヒロ：
「はい。全然分かりません。」
先輩：
「こんな物は覚えなくてもいいんだ。Webで探せば似たような処理はいくらでも見つかる。
とにかくこれも<HEAD>～</HEAD>部分に記述する。で、この処理を追うために
function pMenu(id)
というのだけ覚えろ。」
アキヒロ：
「なんですか？これは？」
先輩：
「これはだな関数とよばれていて”pMenu“というのは関数の名前だ。」
アキヒロ：
「ああ。この関数の中で実際にプログラムの処理が実行されるんですね。」
先輩：
「その通り。そしてこのpMenu関数は以下の様にbody欄から呼び出される。」
<body>
<p><
a href=”javaScript:pMenu(‘pdMENU1′)”>折りたたみメインメニュー</a></p>
<ul class=”sub” id=”pdMENU1″>
<li><a href=”“http://netbusiness.rash.jp/”“>サブメニュー１</A></li>
<li><a href=”“http://netbusiness.rash.jp/”“>サブメニュー２</A></li>
<li><a href=”“http://netbusiness.rash.jp/”“>サブメニュー３</A></li>
</ul>
<br>
</body>
</html>
アキヒロ：
「この箇所から呼び出されるのですね。」
“javaScript:pMenu(‘pdMENU1′)”
先輩：
「そうだ。これは誰かが折りたたみメインメニューをクリックする事で呼び出される。」
アキヒロ：
「なるほど。クリックされる事でHead部に記述してあるpMenu関数が呼ばれ書いてあるJavaScriptが実行されてようやく各サブメニューが表示されるのか。」
先輩：
「そうだ。そしてもしこのpMenu関数を他のWebページでも使用したい場合はこの関数を別のファイルに書き拡張子を(.js)にして保存すればいいんだ。」
アキヒロ：
「そうすることでいちいちhead部に書くことなく色々なWebページから同じ関数を呼び出す事ができるというわけですね。」
先輩：
「そういうことだ。」
アキヒロ：
「なるほど。この例のようなJavaScriptを使うとまたサイトマップなどに役に立ちそうですね。」
先輩：
「そうだな。ページを占有することなくメニューを表示できるからとても便利だ。」
アキヒロ：
「またまたとても参考になりました。」
先輩：
「うむ。俺はいつでも最高に役に立つ男なのだ。ようやくわかったかね。」
アキヒロ：
「それでは。また！」
先輩：
「お、おい。何かつっこんで..。あーあ。」
このページのコメント欄もこのサブメニューの仕組みを利用してます。
AKIさん、こんにちは！
今日のはちょっと難しかったです（汗
でも、言ってる意味は分かりましたよ。
応援ポチポチ♪
こんばんは～かめちきです♪
今日も難しかったです^^;
でも目次を作るなら便利そうですね。
そこまで出来るかどうかわかりませんが^^;
それでは応援ぽちっと♪
おはようございます、ザルガバースです。
凄い仕掛けですね！
初めてみました♪
参考にさせていただきますね！！
また来ますね♪
応援★
ヽ(ﾟーﾟ〃)ﾉｵﾊﾖｳｺﾞｻﾞｲﾏｽヾ(。。〃)ノﾍﾟｺｯ!!
桜良です。
毎回勉強になります！！
いつも(*’▽’*)ア(*’ー’*)リ(*’∀’*)ガ(*’◇’*)トございまぁーす☆
ではでは、応援を！(*´ ｰ`*)σﾎﾟﾁｯと♪
こんばんは～かめちきです♪
かめちきも結果報告とかしてますけど
ほとんど自己アフィリなんですけどね^^;
それとランキングで結果報告部門にも
配分してるんでたまには報告しないと。
もちろんテーマが検証して報告するって書いて
しまってますし。
それでは応援ぽちっと♪
今後も特典を追加します。
現在のところ、こちら↓から購入された方への特典は10個です。インスタントブログアフィリエイト購入はこちらからですが、今後もまだまだ特典を追加していく予定です。少なくとも、インスタントブログアフィリエイトの販売が終了するまでは追加します。
おはようございます、おやじです。
「関数」の文字が出た時点で、おやじの脳が拒否反応を起こしています＾＾；
タグも覚えたいのですが、英語の羅列を見てると頭が痛く・・・・
基本コピペです。(´д｀lll)
応援 ﾎﾟﾁｯ♪
●りりりのりんさん
コメントありがとうございます。
JavaScriptはプログラムを実際作った人じゃ
ないと少し難しいですよね。
●かめちきさん
コメントありがとうございます。
自分もいつかこの機能をうまく利用します。
結果報告。本当にいつできることやら。
●ザルガバースさん
コメントありがとうございます。
なかなか面白い機能ですよね。
自分も始めて見たときは感動すら覚えました。
●桜良さん
コメントありがとうございます。
参考になったようでうれしいっす。
●おやじさん
コメントありがとうございます。
関数とか本当にわけの分からない言葉が
多すぎますね。自分も基本はコピペです。
働いていて時間がないという人でも高額収入を得る方法【これから始めるアフィリエイト】
こんばんは！これから始めるアフィリエイトにようこそ^^
みなさん稼いでますか～？
僕は、稼がせてもらってます。（笑）
アフィリエイトの９…
気になって、こちらも読んじゃいました^^
おもしろ～～～い♪
コンテンツたくさんなのでちょくちょく読みに伺わせてくださいね！