SPOTブログ

2011/09/25

jQueryのアコーディオン式開閉スクリプトを印刷時にはオープンさせる方法

大したことはしてませんが、後で探すときのためにメモしておきます。
紹介されていたスクリプトを元に、アコーディオン式に開閉する機能を追加してみました。

たったこれだけで実現できます。簡単ですね。
div.clickが、「開閉させるためにクリックさせるエリア」で、div.accordionが実際に開閉するエリアです。このあたりは適宜読み替えてください。
また、リンク元の記事のように、メニュー部分などで実装する場合はこのままでもいいのですが、「よくある質問」とか「症例紹介」とか「施工例」など、コンテンツ内で利用する際には、このままだと印刷するときも隠れたままになってしまうので、印刷用のCSSを用意して、display:noneを解除しました。

これで、印刷時にはdisplay:blockがimportantで読み込まれますので、印刷時には開いた状態でプリントできるようになります。