画像スライダーのようなものを作りたいです。スライダーに入るのと同じロジックは、私が非常に必要としているものです。何百万ものプラグインとチュートリアルが存在することは知っていますが、私が望むのは、「スライダー」や「アコーディオン」などの基本的な jQuery パターンから綿毛なしで学ぶことです。非常に基本的な jQuery パターンから学びたいと思います。
JavaScript パターン コレクションにあるパターンの 1 つは、私が探しているものでしょうか?
画像スライダーのようなものを作りたいです。スライダーに入るのと同じロジックは、私が非常に必要としているものです。何百万ものプラグインとチュートリアルが存在することは知っていますが、私が望むのは、「スライダー」や「アコーディオン」などの基本的な jQuery パターンから綿毛なしで学ぶことです。非常に基本的な jQuery パターンから学びたいと思います。
JavaScript パターン コレクションにあるパターンの 1 つは、私が探しているものでしょうか?
私はスライダー機能をパターンとは呼びません、それはもっとトリックです.. jQueryのパターンは本当に制限されています(jsそれ自体と比較して..または他の言語ですが、jQueryは派生物であるため言語とは見なされませんjsの仕事)
現在、jQueryのパターン(またはほとんどの場合、すべてのパターン)は、コード編成の方法であり、コードトリックです。
プラグインのオーサリングにはjQueryパターンが存在します...この記事を参照するか、 jQueryボイラープレートに関する広範なコメント付きのコードを読むことができます。
質問に戻りますが、コア機能に関連する使用するパターンはありませんが、将来的には、より優れた拡張可能なコードを整理して使用するために使用できます。
イメージ スライダーには、適切なソフトウェア デザイン パターンを保証するのに十分なロジックがありません。
あなたのリンクを見ると、これらの多くはパターンではなく、javascript でできることの単なる説明です
画像スライダー自体について、2 つのコンポーネントで見てみましょう。
ユーザー操作コンポーネント: ボタン (前、次) またはスライダー
画像コンポーネント: 現在選択されている画像を表示
実際に行う必要があるのは、現在選択されている画像のインデックスを保存し、その画像を選択したときに画像スライダーをスライドさせる x 位置を検索することだけです。
大まかな例を次に示します。
http://jsfiddle.net/mattdlockyer/bNnEw/
#images
jQuery で animate 関数を使用して div をスライドさせるためのすべての脚の作業を行い、正しいインデックスを保存するのは、最初はほとんど関数ループであることがわかります。これは、ユーザーがボタンを操作したときに呼び出されますが、スライダーがスライド イベントを発生させたときにも簡単に呼び出すことができます。スライダーの詳細については、http: //jqueryui.com/slider/を参照してください。
個人的には、このすべての関数型プログラミングを適切な JavaScript モジュールに入れます。モジュール パターンの使用方法の優れた例については、このリンクを参照してください: http://www.adequatelygood.com/2010/3/JavaScript-Module-Pattern-In-Depth
基本的に、イメージ スライダーの概念だけではパターンを保証するものではありませんが、同じページで何度か再利用できるようにモジュールにラップするユーティリティは、間違いなく実行する価値があります。
Javascript は関数型言語であり、クリーンで移植可能で機能的なコードを記述するための「パターン」が多数ありますが、それらは OOP 設計パターンの私見と同等ではありません。
フィドルを楽しんでください。これがあなたの JavaScript の冒険に役立つことを願っています。