問題タブ [nouislider]

2 つのスライダーがあり、一方のスライダーの動きに基づいてもう一方のスライダーの範囲を更新したいと考えています。

例えば; Slider_1 と Slider_2 の範囲はどちらも 1 ～ 10 です。Slider_1 を位置 1 から 2 に移動すると、slider_2 の範囲が 1-10 から 1-20 に変更されます。スライダー 1 を位置 2 から 3 に移動すると、スライダー 3 の範囲は 1 から 30 になり、以降も同様です。

次のようにスライダーを初期化します。

これまでのところ、これを実装するための最良の方法は、スライダー全体を分解し、毎回新しい範囲で再初期化することです。ただし、スライダーを適切に分解する方法がわかりません。

これをどのように行うべきかについてのアイデアはありますか？

このページの例に示すように、noUiSlider を使用してスライダーと入力をリンクしています: http://refreshless.com/nouislider/linking-input-fields/

$("#slider").Link('lower').to($('#input'));

それはうまくいきます。ただし、値が負 (-1) の場合、入力に渡す前に絶対値 (1) に変換する方法はありますか? 私は次のようなことを考えました：

それはうまくいきません。どんな助けでも大歓迎です。ありがとう！

$.noUiSlider ( http://refreshless.com/nouislider/ )

垂直スライダーの方向を逆にする方法はありますか? つまり、最小値を一番下に、最大値を一番上にすることはできますか? 範囲を最小：-15、最大：0に設定することでそれを達成しましたが、その結果、負の値になり、変換する必要があります。

それを行う適切な方法はありますか？水平スライダーの方向を逆にする方法はありますが、垂直方向のスライダーについては何も見つかりません。

ありがとう！

リンクされた出力から小数桁を削除する方法

私はこのコードを使用しています

私はNoUISliderが初めてで、スライダーを機能させることができました。ただし、スライダーの値が表示されないか、機能しているように見えます。

jQueryも初めてなので、スライダー値のコードが機能しない理由がわかりません。

私が編集しているウェブサイトはここにあります: Experian Map

これが私のコードです：

こんにちは、オーバーフルビアン！

私は Swiss Army ビルド システム ( Gulp、Browserify、Bower、BrowserSync、RunSequence、Nodemon、およびjQuery ) に取り組んでいますが、jQuery プラグインをビルドにシムして DOM を取得しようとすると、困惑します。

自分で問題をすばやく再現したい場合は、サンドボックス リポジトリをまとめました: gulp-browserify-bower-test。頭の中でアプリを作る勇敢な方は、どうぞお進みください。

私が解決しようとしている問題は、分散ビルドで不要な肥大化なしに依存関係が満たされるように、jQuery を適切にシムまたは要求するにはどうすればよいですか?

関連するファイルとその内容は次のとおりです。

1. スライダーを初期化しようとする、事前にブラウザー化されたクライアント側スクリプトbundle.js:

2.index.html初期化するスライダー要素を含むページ:

3. bower.jsonjQuery および jQuery プラグインを導入する

4.package.jsonモジュールをbrowserify shimに魔法をかけ、エクスポートされた名前と依存関係を設定します。

jquery の bower バージョンも使用してみました。これを npm バージョンに置き換えますpackage.json。

5. gulpfile.jsbrowserify gulp タスクが含まれています。

障害物

require('maskedinput')クライアント側のjsでできることに注意してrequire('nouislider')ください"Uncaught TypeError: Cannot read property 'fn' of undefined".

繰り返しになりますが、問題を簡単に再現できるように設定されたサンドボックスは次のとおりです: gulp-browserify-bower-test

何を与える？jQuery とこれらのプラグインをどのように含める必要がありますか?

bowerどちらか、または両方でこれを行うより良い方法はありますBrowserifyか? でホストされているいくつかのモジュールを見つけnpm、bowerビルド、モジュールの種類、および一般的な品質が異なる傾向にあったため、両方のパッケージ マネージャーに対応することが賢明であると考えました。

#annual-sales 入力フィールドに四捨五入されていない数値を入力すると、プラグインは「上」または「下」に応じて自動的に四捨五入します。1234567 などの特定の数値をフィールドに入力して、その値を保持する方法はありますか? 次に、前または次の値にスライドすると、元の位置に戻ります。

noUiSLider の wNumb.js プラグインを使用して、複数のスライダーの入力を米ドルとして表示するようにフォーマットしようとしています。基本フォーマット オブジェクトは最初の入力に対して機能しますが、2 番目の入力と、スライダーを持つ他のすべての入力は空として表示されます。また、ブラウザーは JavaScript エラーをスローしていません。

wNumb ドキュメントへのリンク: http://refreshless.com/wnumb/ noUiSlider ドキュメント へのリンク: http://refreshless.com/nouislider/

基本的な noUiSlider コードは次のとおりです。

NoUISlider で libLink 機能を使用しようとすると、次のエラーが発生します。

キャッチされていない TypeError: undefined は関数ではありません (jquery.liblink.js:260

コード行:

私のHTMLには、次のコードがあります。

私のJavascript：

このページには NoUISlider ライブラリと liblink ライブラリの両方が含まれています。

値ラベルが表示されません。どうすればこれを解決できますか? ありがとう！