タグ

jqueryとスライダーに関するkanariya_wwwのブックマーク (3)

  • jQueryを使ったスライダーの作り方とその仕組み

    Webサイトでは必ずと言っていいほどよく見かけるスライダーUIですが、どういった仕組みで動いているか知っていますか? いまや便利で高機能なjQueryプラグインがたくさんあるため、わざわざイチから作る機会は少ないと思います。しかし、仕組みを知っておけばプラグインで対応できない場合に作ることができますし、プラグインをカスタマイズして実装することもできるようになります。 自分で作ることができるようになると仕様をプラグインに縛られることがなくなるため、わがままな要求にも応えられるようになります。なにより自分で作って動いてるものを見ると楽しいこと間違いなしです。 そういったものでバグが見つかったときの焦り具合も尋常じゃありませんが。 ということで、スライダーの作り方と仕組みを初心者向けに解説していきたいと思います。 (ここでいう初心者とはHTMLCSS・jQueryの基がわかる程度です) ※I

    jQueryを使ったスライダーの作り方とその仕組み
  • 使いやすくて高機能なものが多数!スライダー実装時に便利なプラグインやチュートリアルまとめ - NxWorld

    実際に使用して良かったものも含め、スライダー系のスクリプトやチュートリアルで覚えておきたいと思ってメモしてたのが溜まってきたので備忘録兼ねてまとめました。 とにかく高機能なものから動きがユニークなものまで様々なタイプがあり、ほとんどが最近実装する機会が多いと思うレスポンシブやタッチ・スワイプといった動きにも対応しています。 Slider Pro プラグイン名にProとついているのでパッと見は有料かと思うのですが、無料で使用できるjQueryプラグインです。 とにかく高機能でレスポンシブやタッチ・スワイプといったものはもちろん、下記のように様々な設定や機能が用意されています。 modular architecture responsive touch-swipe CSS3 transitions animated layers (and static) infinite scrolling

    使いやすくて高機能なものが多数!スライダー実装時に便利なプラグインやチュートリアルまとめ - NxWorld
  • スライドショーのプラグイン

    Nivo Slider For WordPressというプラグインを利用しています。 最後まで画像が進んだら繰り返してスライドするのではなく、スライドを停止させたいのですがどうすればできますでしょうか? オプションも見てみましたが見当たらずスライドを停止させる方法がわからず困っております。 また、絶対Nivo Slider For WordPressでないといけない理由もないのでスライドショーが簡単に実装できるプラグインがあれば教えてください! nivoslider4wp-show.phpの61行目を以下のようにすれば、最後のスライドを表示した時点で止まるんじゃないかと思います。 lastSlide: function(){ $('#slider').data('nivo:vars').stop = true; }, // Triggers when last slide is shown

    スライドショーのプラグイン
  • 1