2009-05-18 12 views
7

を使用せずに存在してJavaScriptの範囲スライダ/デュアルスライダー私はレンジスライダー(デュアルノブ)があるJavaScriptのコントロールを探しています:枠組み

  • は、例えば道場(既存のJSフレームワークを使用していませんjqueryなど) - 私が必要とするコンポーネントだけでコンパイルできる独自のサブフレームワークをロール/作成できない限り、すべての主要なブラウザ

  • 作品例レンジスライダーが下にあるが、もちろん、これはjQueryのを使用しています - ので、私はjQueryのを建てても、唯一の私は(jQueryのを必要とする構成要素を含むので、これはオプションではありませんUIコア+スライダー)それは140キロバイト縮小さです:

    http://jqueryui.com/demos/slider/#range

  • +4

    なぜフレームワークを使用しないという要件ですか?フレームワークが存在する主な理由は、「すべての主要なブラウザで動作する」ことです。 –

    +0

    @Benブランク - 私は、ユーザーが使用しないコードをダウンロードする必要はないと思っています。 JSフレームワークを使用した場合、おそらくフレームワークの90%が使用されなくなります。したがって、JSフレームワークが、必要な正確なコンポーネントのみを含む独自のサブフレームワークを "ロール/作成"することができれば、それは役に立たないが、このロジックの問題は –

    +0

    @ Hank892問題あなたが求めているのは、JSの複雑なUI関数です。これは、正しく動作させるためには多くの基礎作業が必要です。この特殊なケースのために自分自身をロールしない限り、余分なJSが保証されます。 –

    答えて

    5

    jQueryのUIは素晴らしいものがあります。

    http://jqueryui.com/demos/slider/

    +0

    JQuery one私は望んでいない既存のJSフレームワークを利用しています.2)最も重要なのは、単一のスライダです(ハンドルが1つだけです)。 - デュアルスライダ(2つのハンドルを持つ)について質問しています。 –

    +4

    非常に深く掘る。 :)マルチスライダ、http://jqueryui.com/demos/slider/#rangeです。これらは非常に複雑なので、現在のフレームワークを活用していないものを見つけるには問題があると感じるでしょう。 Yahooには1つあり、ExtJSには1つあり、jQueryには1つありますが、すべてのJSフレームワークでコアのUXフレームワークからビルドされています。 –

    +1

    http://jqueryui.com/demos/slider/#range jquery +このスライダープラグインを使用すると、〜75kbのスクリプトになります。 –

    0

    http://www.walterzorn.com/dragdrop/dragdrop_e.htm#addonsのスライダーコードを使用してください。これは単一のハンドルですが、基礎となるdrag-drop.jsは非常に柔軟です。独自の2番目のスライダを追加して、各バーのmin-max範囲をプログラムで別の位置に基づいてロックする必要があります。これを実装するには、12kb(lgpl'ed)のスクリプトインクルードと約10〜20行のコードが必要です。

    2

    YUI 3(現在のプレビュー版)は、あなたが求めていることを行うために必要な最小限のコードしか取り入れていません。彼らの基本的なスライダの例(http://yuilibrary.com/yui/docs/slider/slider-basic.html)は、24kのJavaScriptと1k未満のCSSしか取り込みません。それはかなり滑らかです。

    開示:私はYahoo!の仕事をしています。

    +0

    @Potchかなり滑らかですが、YUI 3はデュアルハンドルスライダーをサポートしていますか?あなたのリンクは、単一のハンドルスライダーのように見えます。 – TeddyR

    関連する問題