OPEN&CLOSEボタン
OPEN&CLOSEボタン
***************************************************************
隠れている内容です。隠れている内容です。隠れている内容です。隠れている内容です。隠れている内容です。隠れている内容です。隠れている内容です。隠れている内容です。隠れている内容です。隠れている内容です。隠れている内容です。隠れている内容です。隠れている内容です。隠れている内容です。隠れている内容です。隠れている内容です。隠れている内容です。隠れている内容です。隠れている内容です。隠れている内容です。隠れている内容です。隠れている内容です。隠れている内容です。隠れている内容です。隠れている内容です。隠れている内容です。隠れている内容です。隠れている内容です。隠れている内容です。隠れている内容です。隠れている内容です。隠れている内容です。隠れている内容です。隠れている内容です。隠れている内容です。隠れている内容です。隠れている内容です。隠れている内容です。隠れている内容です。
***************************************************************
隠れている内容です。隠れている内容です。隠れている内容です。隠れている内容です。隠れている内容です。隠れている内容です。隠れている内容です。隠れている内容です。隠れている内容です。隠れている内容です。隠れている内容です。隠れている内容です。隠れている内容です。隠れている内容です。隠れている内容です。隠れている内容です。隠れている内容です。隠れている内容です。隠れている内容です。隠れている内容です。隠れている内容です。隠れている内容です。隠れている内容です。隠れている内容です。隠れている内容です。隠れている内容です。隠れている内容です。隠れている内容です。隠れている内容です。隠れている内容です。隠れている内容です。隠れている内容です。隠れている内容です。隠れている内容です。隠れている内容です。隠れている内容です。隠れている内容です。隠れている内容です。隠れている内容です。
***************************************************************
その名の通り、そのボタンをクリックすることによりOPENとCLOSEの動作がされるボタンになります。
たくさんの情報を伝えたいが、ナビゲーション的には好まれない場合など多々あると思われます。
このボタンのすぐ上で目を引くキャッチフレーズだけ表示させ（シンプルなページの作りでわかりやすいナビゲーションを）、詳細はこのボタンの下に隠しておきます。
そして、そのキャッチに興味を引かれた訪問者は、このボタンをクリックするということです。
あらかじめ、ページ表示直後に、ボタンを閉じるブラインド（アクション）のアニメーションが自動的に表示されます。これにより、訪問者はそこに閉じた内容が存在することを認識します。
また、隠された情報には興味を引かれてしまうという人間の心理をつくニクい仕掛けになっています。
*極端に長い内容を隠すアニメーションには対応していないため、スムーズな動きが作動しない事があります。（アニメーションが機能しなくなることはありません。）
*このボタンは1ページに一つしか動作しませんのでご注意下さい。（1サイト内に一つだけ使用できるものとお考え下さい。）
■導入方法
エントリー投稿欄に以下の記述をすることで導入できます。
<div id="news_list">
<div id="news1" class="click">OPEN&CLOSEボタン</div>
<div id="news1_cont">
通常、隠したい内容をここに記述。
</div></div>
[補足]
*<div id="news1" class="click">OPEN&CLOSEボタン</div>内のOPEN&CLOSEボタンの部分を書き換えることによってボタンの文字を変更できます。
*通常、隠したい内容をここに記述。という部分に記述したテキストが「OPEN&CLOSEボタン」を押したときに表示される部分となります。
ここには「img」や「table」等のHTMLタグで記述する事もできます。