【JavaScript】jQuery画像スライダーのライブラリまとめ

jquery-image-sliders-library

WEBサイトのトップページなどでよく見る画像がスライダーする仕組み。jQueryライブラリと組み合わせで機能するスライダー用のライブラリをまとめてみました。

Easy Slider

左右の矢印、数字ボタンによるナビゲーションがあるシンプルな画像スライダーです。

easyslider1.7

AnythingSlider

左右の矢印、丸ボタンによるナビゲーションがあるシンプルな画像スライダーです。画像以外に動画、HTMLソースの要素をスライドにすることができます。

AnythingSlider

SlidesJS

レスポンシブに対応している左右の矢印、丸ボタンによるナビゲーションがあるシンプルな画像スライダーです。

slidesjs

Nivo Slider

レスポンシブに対応している左右の矢印、丸ボタンによるナビゲーションがあるシンプルな画像スライダーです。有料のWordPress用のプラグインなどもあります。

nivo-slider

Superslides

フルスクリーン画面に対応した画像スライダーです。画面一杯に画像が表示されるのが特長です。

superslides

bxSlider

左右の矢印、丸ボタン、サムネイル形式など多彩なオプションがある画像スライダーです。レスポンシブにも対応しています。

bxslider

関連記事

【ツール】レスポンシブサイトの確認に便利なViewportエミュレーター『Dimensions』

レスポンシブサイトを制作すると、PCやスマートフォン、タブレットでそれぞれ表示が異なるため、表示もそれぞれの端末に合わせたサイズでの確認が必要になります。 そこで便利なツールとして、Google Chromeのアプリに端末サイズごとのシミュレーションができる『Dimen...続きを読む

2015.02.10HTMLコーディング

【デザイン】デザイナーポートフォリオサイト

活躍しているデザイナーの事例をみてインスピレーションを刺激することは、デザインの勉強にもなります。今回は、デザイナーのポートフォリオサイトを集めてみました。 http://www.onebyfourstudio.com/ http://www.31three....続きを読む

2015.02.14インスピレーション

【WP】WordPressの本文抜粋・本文の一部を取得する

WordPressで投稿された記事の本文の一部「抜粋」を取得するために、テンプレートタグthe_excerpt()とget_the_excerpt()があります。the_excerpt()とget_the_excerpt()は、投稿時に抜粋欄へ入力があればその内容が表示され、抜粋...続きを読む

2018.12.04HTMLコーディングWordPress

【デザイン】バレンタインカードにぴったりなデザインワークスまとめ

今日は、バレンタインにちなんだカードのデザインワークスをまとめみました。ツールのキットやハウツーが掲載されており実際にカードを作るときの参考にもなります。 Hearts a Flutter ツールキットを組み合わせて制作されたカードです。ハートやリボンの組み合わせがか...続きを読む

2015.02.15インスピレーション

モバイル端末の画面サイズまとめ

WEBサイトを制作するときのサイズの基準になるのが画面の解像度です。 基本的には、ディスプレイサイズに合わせてデザインされるので、横幅が920px~1024pxあたりでレイアウトされるのが主流といえます。 最近では、スマートフォンやタブレットなどでWEBサイトを閲覧する機...続きを読む

2015.02.06HTMLコーディング