Blog

メインビジュアルを自動でゆっくりスライドさせて流す方法①

2013.02.06Cat:javascript jQuery デザイナー

最近いろんなwebサイトをチェックしていると、メインビジュアルが横にゆっくり自動で流れているものを
見かけることがあります。

気になったので、実際に試してみました。

DEMO

実装は難しくありません!

背景画像を1pxずつずらしていくといった感じになっております。

javascript

時間を早くしたり、遅くしたりしてもいいと思います。
また、今回ヘッダーのメニューがあるので、背景画像を上から50pxの位置に設定してますが、
実際は0とになるのではないかと思います。

html

css

cssは該当箇所だけ載せます。

背景の画像をシームレスにすると、継ぎ目がなくてもっといい感じになると思います。

いろんな写真を載せたい場合はどうすればいいか、
ということもあると思います。

それはまた次回にやりたいと思います!

Author Profile

Y.A

アベと申します。
ディレクター兼デザイナー兼コーダーです。
まだまだ未熟者ですが、日々頑張っています。。。

» 投稿一覧
  • Launch Cart次世代ECサイト構築システム 初期月額無料
  • LaunchMovie ECに特化した動画制作サービス

Archive

ページTOPへ