prototype.jsを使ったスマートスクロール（メモ）

2006年4月 9日 23:33
Category : WWW

大手企業のサイトなどにある「トップに戻る」表記ですが、ただアンカーをクリックしたときにパッと移動するのではなくて、動いていることがわかるようにスーッという動きがあったら解りやすく面白いのではないかと思ってソースを探してみました
スムーズなナビゲーションの例）
YAMAHA
旅の本屋：BOOK246

ZEROBASE：[ajax] ページ内リンクでスムーススクロール
という記事を見つけたので、ページ内リンクをスムーズに移動させる手段としてやってみました。
方法は、prototype.jsとZEROBASEサイト内で配布されているjsソースを用いてやってみました。

凄い簡単。
ヘッダーにJSファイルへのリンクを書いて、あとは普通にアンカータグするだけ‥‥のはずなのですがなぜかWinのOPERAでしか動作せず。
いろいろ検証してみた結果、bodyタグに一個でも属性や何かが入っていると駄目でした。試しに、このサイトのトップページにも入れてみましたが、bodyにIDが入ってるせいかスムーズには動かなかったです。私にきちんとjavascriptを記述する技術があればこの問題も解決出来たのかも知れませんが、自力では現時点では解決できないし、「上手く動作しなくても問題ない」のがこのスクリプトの凄いところだと思うので、むしろHTMLソースを見直す方向で行きたいと思います。