Blog

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

2013.02.13Cat:javascript デザイナー

前回に引き続きのテーマですが、
今回は方法がちょっと違います。

前回は、背景画像をスライドさせる形でしたが、
今回は、ul,liタグ使い、写真を複数置いたビジュアルをスライドさせた形になります。

それでは、DEMOをご覧下さい。

DEMO

margin-leftを使用し、ulをずらしています。
見えなくなった先頭の要素を一番後ろに入れて、、
というの繰り返して無限ループになるようになってます。

以下、javascritになります。

HTML

しかし、これは汎用性があるとはいえません。。。。
画像のサイズは指定しなければいけないですし、
画像の横幅も均一にしなければいけません。。。

横幅もバラバラの場合を都合上作ることができませんでした。

うーん、悔しい。

Author Profile

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

越境ECの最新情報

越境EC関連の記事

月から探す

ページTOPへ