レスポンシブ対応のjsスライダー Juicy Slider

cap

Juicy Sliderはレスポンシブ対応のスライダーを実装できるjsプラグインです。

軽量で、実装も簡単です。

スポンサーリンク

デモ

デモページを用意しました。

画面の横幅が短くなると、画像の両端が切れるタイプです。

画像の両端が切れても、マウスオンした時に表示される左右の矢印ボタンはきちんと表示されます。

実装方法

デモページの実装方法です。

1. こちらのページの右のメニューにある「Download ZIP」ボタンからソースを落とします。

2. juicyslider.css、juicyslider.jsを読み込みます。jQuery、jQuery UIも必要です。

3. htmlの記述はこんな感じです。

4. cssの設定です。

5. htmlに下記のスクリプトを追記します。

スポンサーリンク
Juicy Slider – レスポンシブ対応のjsスライダー

みんなが見ている人気記事

コメントを投稿する

  • Posted on 2014.11.30
  • Views 1,675