長い内容を限られた範囲で表示するスクリプト

Web活用備忘録

アイタスの新人？制作Tです。

Webサイトを巡っていて、たまに不便に思うことがあります。それは「文章量が多いページを読むときのスクロール」。

マウスホイールの操作を延々と続けるのは、意外とユーザーの負担になるのですね。

今回紹介するスクリプトは、あらかじめ区切っておいたページの内容を、決まった範囲の中でスクロールさせるスクリプトです。

Slick Tabbed Content Area using CSS & jQuery
配布元
 デモ
たくさんの更新情報を１ヶ所におさめつつ、多少の演出を加えています。SonyグループのWebサイトが更新情報の表示のために実装しているスクリプトの、演出強化版と言えますね。

jQuery.SerialScroll
配布元
 デモ
表示枠の中で一枚の文書が縦横無尽に動きます。ホテルや学校の館内見取り図を動かしながら見せるなど、Flash的な表示の演出を行うのにちょうど良いのではないでしょうか。

使いどころは難しいのですが、デザインの都合上絶対にスクロールさせたくない場合や、マニュアルなどの長い記事を出来るだけ少ないスクロールで表示したいとき、新着情報や更新情報などのたくさんの情報を限られた面積で表示したいときは有効だと思います。

＜制作＠アイタス＞

このエントリのキーワード:Webデザイナー, 社内勉強会