クリックしたら文章が出てくる

質問

以下のサイトの中で『読む』をクリックしたら文章が出てきて、『閉じる』をクリックしたら文章が消えるというようになってるんですが、これはどのようにすれば出来るんですしょうか？
http://javascript.maxux.com/
自身のサイト内に取り入れたいと考えています。
初心者なので分かりやすく教えていただければ甚大です。
よろしくお願いします。

回答No.1

fujillin

ソースを見てみればわかりますが、javascriptで行っています。
（javascriptのサイトみたいなので、見るまでもないですが…）

HTMLソースには全部の内容が記述されていて、最初は一部が非表示になるように設定されています。
クリックすると非表示になっている段落が表示されたり、また非表示になったりと言う仕組み。
（CSSのdisplay:blockとかnoneなどを切り替えているだけです）
同時に、同じ要領で「読む」、「閉じる」という表示も切り替えています。

実際に実行しているスクリプトは、外部ファイルのchgAdv.jsというファイルの中に記述されていて、表示する方が showpara()、非表示が hidepara()で丁度逆の動作をするようになっています。

対象の箇所が複数あるので、呼び出すときに場所を指定するために番号を引数として渡していて、操作対象となる要素にはHTML内に、あらかじめそれに対応するidがつけられています。
　chap1、　read1、　close1　など（1の部分が番号）

たいして難しくないので、HTMLソースとスクリプトを見てみれば大体見当はつくのではないかと…