デザイン

デザイン

jQueryプラグインを使用した無料スライダー15選でWebデザイン性を高める

speckyboy

Speckyboy is an online magazine for designers with its focus on sharing helpful resources, exploring new techniques, sharing useful tips, and inspiring you to build a better web.

本記事は、15 Free Slider & Carousel jQuery Plugins
翻訳・再構成したものです。
配信元または著者の許可を得て配信しています。

328 views

読了時間 : 約2分39秒

最近では、コンテンツスライダーはとても人気で、ウェブで話題になっています。サイト訪問者は、静的リンクではなく動的コンテンツとやり取りする可能性が多くなりました。適切に実装されている場合、最も重要なコンテンツと製品をWebサイトの前面と中央に配置できます。

 

jQueryのスライドダープラグインは、わずか数行のコードで実装できます。ほとんどのエフェクトはJavaScriptを使用して作成されますが、CSSトランジションとアニメーションを効果的に使用するものもあります。

 

これらのスクリプトは軽量ですが、Webページに1つだけ使用することをお勧めします。ページの読み込み時間に大きな影響を与える傾向があるためです。また、jQueryイメージギャラリーを構築できるライトボックスプラグインを選択するのも良いかもしれません。

 

 

Skippr

Skipprは、jQuery用の非常にシンプルで軽量なスライドショープラグインです。

 

 

 

FSVS

FSVSは、jQueryフォールバックのCSS3トランジションを使用したシンプルなフルスクリーン垂直スライダーです。

 

 

 

ItemSlide.js

ItemSlide.jsは、タッチスワイプとマウスホイールスクロールをサポートするシンプルなJavaScriptです。

 

 

 

Simple jQuery Slider

このスライドは、スライダーの役割を忠実に果たしています。

 

 

 

lory.js

lory.jsは、JavaScriptで記述されたタッチ対応のミニマルなスライダーです。

 

 

 

slideToucher

slideToucherは、垂直方向と水平方向の両方のスワイプをサポートするコンテンツスワイプタッチ対応のjQueryプラグインです。

 

 

 

Flexisel Responsive Carousel

Flexiselはレスポンシブ画像カルーセルプラグインで、モバイルおよびタブレットデバイス用にカルーセルを適合させるためのオプションが用意されています。

 

 

 

FilmRoll

ページの中央に、選択した商品を表示する軽量でシンプルなjQueryカルーセルプラグインです。

 

 

 

 

Owl Carousel

Owl Carouselは、応答可能なカルーセルスライダーを作成できるタッチ対応のjQueryプラグインです。

 

 

 

BookBlock

BookBlockは、「ページフリップ」ナビゲーションを可能にするブックレットなどの作成に使用できるjQueryプラグインです。

 

 

 

Adaptor

驚くような2Dまたは3Dのスライドアニメーションを作成するためのシンプルなインターフェイスを提供する軽量のコンテンツスライダーです。

 

 

 

rcarousel

高度にカスタマイズ可能な連続スクロールカルーセルのjQueryプラグインです。 古いブラウザもサポートしています。

 

 

 

Rhinoslider

Rhinosliderは、複数のエフェクトスライダーとスライドショーのプラグインです。 シンプルなフェードまたはリッチエフェクトとして使用できます。

 

 

 

µslider

µsliderは軽量のjQueryコンテンツスライダープラグインで、いくつかの重要なオプションが付属しているため迅速に構成できます。

 

 

 

ResponsiveSlides.js

ResponsiveSlides.jsは、単一のコンテナー内の画像を使用してレスポンシブスライドショーを作成する小さなjQueryプラグインです。

 

 

 

Turntable.js

Turntable.jsは、応答性の高い軽量のjQueryスライダーで、マウスがコンテナー上を移動するときに画像を切り替えます。

 

【コンビニでも使える!メルペイ初回利用1500円分招待コード】

当サイト限定招待コード:CMUTDF

 
・利用可能店舗:メルカリ、コンビニ、ドラッグストア等
・金額:500円分
※さらにメルペイスマート払で1000円分ポイント!
 友達招待でさらに500円分ポイント!

メルカリ-フリマアプリ&スマホ決済メルペイ

メルカリ-フリマアプリ&スマホ決済メルペイ

無料

 

ピックアップ! さらに今このキャンペーン中です↓

dポイント最大10%『4・5・6月の金・土曜限定!』
■キャンペーン期間:2020/4/1日(水)0:00 ~ 6/30(火)23:59

 

 

【MOV初回限定 合計2,000円相当無料クーポン3枚】

クーポンコード:seleqt2000

 
対応地域:神奈川県、東京都、大阪府、京都府、兵庫県(新登場)
 
2000円オフで登録» »MOVの初回利用2000円オフのクーポンを使って登録はこちら!
 
アプリDLはこちらから↓

MOV《モブ》- タクシー配車

MOV《モブ》- タクシー配車

DeNA Co., Ltd.無料

 

 

 

Seleqtをご覧頂いた方だけに「朗報」
\当サイト限定特別クーポン/

【UberEats初回1000円オフクーポン】
interjpq2206j2tw

 

対象店舗:マック、ガスト、スタバ、ピザハット、松屋 等
※1000円分無料で頼めます。〇〇円以上とかもナシ!完全無料でお試しOK
割引額:1000円引き

 

1000円オフで登録» »当サイト限定の初回利用1000円オフのクーポンを使って登録はこちら!

 

アプリDLはこちらから↓

Uber Eats: 地元で人気の料理をお届け

Uber Eats: 地元で人気の料理をお届け

無料

 

おすすめ新着記事

おすすめタグ