2008.09.28
折りたたんだ「続きを読む」を元の位置まで戻す方法
前回のエントリー(「WordPressの「続きを読む」の折りたたみをJavaScriptで実現」)で「続きを読む」をJavaScriptで折りたたみにする作業は完了したのだけれど、ちょっと気になる動きが。
続きを展開した状態から閉じると、閉じた分だけ先にスクロールした状態になってしまうのです。(^^;
これだと開く前はどこまで読んでたのかが判らなくなりそうなヨカン。
てなわけで、「続きを読む」を閉じたときは、その「続きを読む」の位置まで戻るようにしようと思いました。
さて。
狙ったところに戻すにはaタグのname属性でリンクを指定すれば良さそう。
有り難いことに元々「#more-番号」がリンク先になってるので「続きを読む」の位置にあらかじめ<a name="more-番号">を仕込んでおけばOKかなっと。
厳密に言うとXHTML1.1以降ではa要素のname属性は廃止されるらしいので、これってちょっとトリッキーなやり方ではあるんですが、XHTML1.0ではセーフwっぽいので良しとします。
(うちのブログはXHTML 1.0 Strict DTD)
折りたたみの参考にさせていただいたここ
→AlienLoveSecrets » WordPressで続きを読むを折りたたむ
の記事の「2.get_the_content関数の$outputへの代入箇所を修正
」の部分から次の記述を探して、
↓
$output .= "¥n¥n".'<span id="more-link-'."$id" .'">
その後ろにこれを足します。
↓
<a name="more-'."$id" .'">
これで閉じたときの飛び先が決まるので、「続きを読む」の位置まで戻るようになりましたー。
上の修正を加えたfunctions.phpの中身はこちら。
もちろん使用は自己責任でよろしく。(^^;
→ functions.phpの中身
(「WordPressの「続きを読む」の折りたたみをJavaScriptで実現」の記事中でも差し替えてあります。)
Web拍手
このページへのリンクを作る
このページへのリンクは自由にどうぞ。JavaScriptが有効であればエリア内クリックで全選択されますので、コピーしておつかいください。
↓
コメント & トラックバック