Auto-Text-Scrollは自動でテキストが垂直でスクロールしていく機能を実装できます。1行ずつテキストがエフェクト付きでスクロールされます。フェードやスケールといったエフェクトで、テキストを次々にスクロールしながらユーザーに見せたい場合に最適です。
インターバルのセッティングも可能
以下のページからAuto-Text-Scrollの実際のデモ動作を確認できます。
デモでは下から上にテキストが自動でスクロールしながら表示されます。一番下に出てくるテキストはサイズも小さく濃さも薄い状態ですが、スクロールされながら徐々に上に来るにつれてサイズが大きくなり濃さもクッキリしていきます。
メインポジションまで来ると一番目立つ状態になり、その次のスクロールではフェードとともに消えていきます。
シンプルですが、自動でスクロールされていくその動きにユーザーも思わず注目してしまうでしょう。一行ずつ何かのテキストを自動スクロールで表示させておきたい時に役立ちますね。
実装にはjQueryとCSS3が使われています。マークアップの記述もシンプルでわかりやすいので手軽に実装できそうです。また、インターバルのセッティングは次のようになっています。
setInterval(function(){
dp_scroll_text()
}, 2000);
2000という値、つまりは2秒ごとにテキストをスクロールする設定なので、変更したい場合はここの値を調節してあげればOKです。
というわけで、垂直式にテキストを自動でスクロールしていく「Auto-Text-Scroll」の紹介でした。Auto-Text-Scrollの詳細・ダウンロードは、以下のページからどうぞ。
