CakePHP::「ページ先頭に戻る」ボタンをつけましょう

よくある、ページ先頭へボタン
よくある、ページ先頭へボタン

scroll_top.gif とかで適当に保存しとく。

で、部品作成。
app/views/elements/scrolltop.ctp

<div class="scrolltop">
< ?php
		e($html->link( $html->image('button/scroll_top.gif') , '#pagetop' , null ,null , false ));
 ?>
</div>

で、全ページに反映されるように レイアウトファイル layout.ctp( default.ctp とか、使うページに合わせてね)
一番上に id=”pagetop” を適当に振っといて $content_for_layoutの後(ボタンをつけたいところ)に

< ?php e($this->element('scrolltop')); //ページ上部へ戻るボタン ?>

が入るようにしとけば、どのページの一番下にでも上記ボタンがつくようになる。

長いページが生成される時は、アクションごとの view で挿入したいところに
さっきの $this->element… を記述すれば同じ形で入ります。

ボタンの右寄せ左寄せとか微妙な位置合わせは css で div.scrolltop に記述しとけばOK。

スムーズスクロールとかはJQueryでプラグインいろいろあるので、それを使えば楽ちん。
基本はこの形でいいんじゃないかなー。

※e($this->element(‘hoge’)) ;っていつからつかえるんだろう(汗) 1.2から?
昔に書いたソース見てると e($this->renderElement(‘hoge’)); だったし、そう書いてたけど、
参考にしたページをふと見ると $this->element() で片付いてたのでこっちにした…
どっちでも動いてるし…まあええか(またかよ!

コメントを残す

メールアドレスが公開されることはありません。