jquery.cross-slide.jsの改造

CrossSlideというjQueryプラグインがあるのですが、使用する画像のパスをスクリプト内に書かないといけないのがちょっと不満だったのでHTMLから画像を取得してスライドショーを実行するという仕組みに改変しました。

以下のように指定して使用するのですが、

こういう感じのHTMLに対して適用させたい。

コード内のplanという変数が画像パスを受け取っているところですので、このplanをHTMLから取得するように改変します。

100行目あたり

に変更(スクリプト上の第2引数を使わない)。

109行目あたりに以下を追加。
デフォルトでは画像ごとにアニメーションを指定できるのですが、fromとtoをいくつか用意しておきその中からランダムで選ぶというかたちにしました。

実行の際は画像パスを指定していた部分の引数は含めずに書きます。

これでHTML上に存在する要素からアニメーションを生成することができます。

AD

Share

Commentsコメント

メールアドレスは公開されません。コメントは必ずご入力ください。

HTMLタグは使用できません。ソースコードを書き込みたい場合はCodetterGistCodePenなどのご利用が便利です。