0

私は正しい方向に進んでいると思います。単純なものが欠けているようです

jquery ノブ プラグインを使用して入力フィールドを更新しています

$('document').ready(function() {

    $(".knob").knob({
                    change : function (value) {
                        //console.log("change : " + value);
                    },
                    release : function (value) {
                        //console.log(this.$.attr('value'));
                        console.log("release : " + value);

                        var num = parseInt($("#sitesinput").val());
                        var total = $(".one").length;
                        alert(num + ' ' + total);

                              $(".one").slice(1,value).fadeToggle();


                    },
                    cancel : function () {
                        console.log("cancel : ", this);
                    }
                });

});

<div class="item box one">1</div>
<div class="item box one">2</div>
<div class="item box one">3</div>
<div class="item box one">4</div>
<div class="item box two"></div>
<div class="item box two"></div>
<div class="item box two"></div>
<div class="item box two"></div>
<div class="item box three"></div>
<div class="item box three"></div>
<div class="item box three"></div>
<div class="item box three"></div>

デモに取り組んでいるデモへのリンクを添付しました

ありがとう、

4

1 に答える 1

1

フェード トグルを次のように変更します。

$('.one').slice(0,value).fadeOut();
$('.one').slice(value).fadeIn();

つまり、値より下のものを非表示にし、それより上のものを表示するということです。あなたは近づいていましたが、フェード トグルは、あなたが望まないものを非表示/表示していました。

JSFiddle: http://jsfiddle.net/HYt4Z/6/

于 2013-03-12T11:37:41.797 に答える