[JS]シンプルなHTMLで、レスポンシブ対応のかわいいデザインのスライダーを実装するスクリプト -Unslider
シンプルなHTMLで、レスポンシブ対応のかわいいデザインのスライダーを実装する超軽量のjQueryのプラグインを紹介します。 キーボード操作やスワイプ操作、そしてマニュアル操作にも対応！ Unslider Unslider -GitHub Unsliderの特徴 Unsliderのデモ Unsliderの使い方 Unsliderの特徴 オープンソース ライセンスは「WTFPL」で、個人・商用問わずどんな風に使ってもOK。 超軽量 スクリプトは6KBで、超軽量です。 実装は簡単でクリーンなHTML 数分で実装でき、非常にシンプルでValidなHTML。 スライドの方向は多彩 通常の水平方向は左右どちらにも順向きで対応、垂直方向のスライドも可。 レスポンシブ対応 デスクトップ・タブレット・スマフォなど、さまざまなデバイスに対応。 キーボード操作の対応 キーボード（矢印キー）での操作をサポートし
![[JS]シンプルなHTMLで、レスポンシブ対応のかわいいデザインのスライダーを実装するスクリプト -Unslider](https://cdn-ak-scissors.b.st-hatena.com/image/square/08bc7be458afe18c7e32cf5b8ed94c85bcfb1cd0/height=288;version=1;width=512/https%3A%2F%2Fcoliss.com%2Fwp-content%2Fuploads-201504%2F2015120302-03.png)
使いやすくて高機能なものが多数！スライダー実装時に便利なプラグインやチュートリアルまとめ - NxWorld
実際に使用して良かったものも含め、スライダー系のスクリプトやチュートリアルで覚えておきたいと思ってメモしてたのが溜まってきたので備忘録兼ねてまとめました。 とにかく高機能なものから動きがユニークなものまで様々なタイプがあり、ほとんどが最近実装する機会が多いと思うレスポンシブやタッチ・スワイプといった動きにも対応しています。 Slider Pro プラグイン名にProとついているのでパッと見は有料かと思うのですが、無料で使用できるjQueryプラグインです。 とにかく高機能でレスポンシブやタッチ・スワイプといったものはもちろん、下記のように様々な設定や機能が用意されています。 modular architecture responsive touch-swipe CSS3 transitions animated layers (and static) infinite scrolling
carouFredSel[jquery]を使ってサムネイル[カルーセル]が付いたスライドショー - CodingMania
スライドショー下にサムネイルのカルーセルを設置したスライドショーです。自動送り・手動送りできます。 carouFredSel を使っているので、先にjqueryとjquery.carouFredSel-6.2.1.jsを読み込みます。 サムネイル用の画像はスライド用画像を小さくして表示しているだけなので、スライド用の画像のみ用意すればサムネイル画像も表示されます。 5枚以上の構成になっていますので、5枚ない場合は、リストのタグを繰り返してください。。。 デモページへopen_in_new JSを読み込みます <script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> <script src="../js/jquery.carouFredSel-6.2.1.js"></script> J
パララックスなスライダーを実装できるjQueryプラグイン「FractionSlider」:phpspot開発日誌
FractionSlider: jQuery parallax Slider Plugin | jacksbox.design パララックスなスライダーを実装できるjQueryプラグイン「FractionSlider」 最近よく見る縦スクロールするとパララックス効果、ではなく横にスライドしてアニメーションっぽいスライダーが作れるプラグインです 単なる画像をペラペラ紙芝居っぽくめくるのではなくて、よりアニメっぽい表現が可能です。 <div>をリストにして定義し、中身を記述していけば作れるようです Flashでやってたようなことも、どんどん置き換わっていますね 関連エントリ ギャラリー、スライダー等、複数画像の見せ方を色々提供するjQueryプラグイン「Rondell」 様々なタイプのスライダーが作れるjQueryスライダープラグイン「Jquery Slider Shock」 軽量のスワイプ可
jQueryでページ遷移時にスライドアニメーションをつけてみる【改訂版】｜BLACKFLAG
かなり前に「jQueryでページ遷移時にアニメーション効果をつけてみる。」と題して、 jQueryでページ遷移時に画面をスライドさせるアニメーション効果をつけるSCRIPTを紹介しましたが、 どうやらブラウザによって、画面遷移後にブラウザの「戻る」ボタンで前画面に戻ると 遷移時にアニメーション用の動作として操作したCSSの指定が残ってしまって 画面が真っ白になることがあったので、その不具合対応版を作ってみました。 jQuery PAGE SLIDE MOVE まずはサンプルから 【改訂版】サンプルはこちら※「次へ」をクリックしていくとページ全体がスライドして遷移します。 画面内の「次へ」などをクリックして画面遷移した後、 ブラウザの「戻る」ボタンを押しても画面が真っ白にな現象は発生しないと思います。 ※以前の記事のサンプルはブラウザによって画面が真っ白になります。 以前の記事の内容から H
165 Awesome jQuery Sliders and Other Useful jQuery Effects - tripwire magazine
20+ Awesome jQuery Slider Plugins – Show Off Featured Content! by Lars | Last updated May 7, 2017 | Javascript, jQuery Plugin Collections | 109 comments jQuery Slider plugins are very useful and increasingly popular web page elements used for highlighting important content. By using a jQuery slider plugin, one can create amazing HTML slider effects with fancy animations of content elements like te
紙芝居のようなアニメーションでスライドするスライダー実装jQueryプラグイン「Innovation Slide」:phpspot開発日誌
Innovation Slide - PlugIn jQuery 紙芝居のようなアニメーションでスライドするスライダー実装jQueryプラグイン「Innovation Slide」 動きが昔見たような紙芝居風なスライダーです。左にスライドし、奥にしまわれます。 WEB紙芝居的な使い方でやると面白いことができるかも データは ul li リストで定義して初期化するだけです。 jQueryには個人的にノーベル賞をあげたいです 関連エントリ jQueryベースの画像スライダー３０まとめ 画像スライダーに関することならお任せ！なjQueryプラグイン「Slider Kit」 Apple.comの新スライダーエフェクトを実装するjQueryプラグイン
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
BookBlock: A Content Flip Plugin - Demo 1
Top 10 Best jQuery Slider Tutorials