Question

我更新鲜，正在研究jQuery Knob.it工作正常，但我的问题是当我滚动到旋钮部分我想使动画像0到某些特定的设置..无论如何通过使用另一个js像（航点）等等，请让我旋钮......等。

Answer 1

给div或任何标签的目标位置赋予一些id，假设你的目的地点有任何div标签，你希望你的光标在特定地点击之后滚动...

....

然后，在锚点链接中证明相同的id，点击后你想要你的光标滚动... 例如你的锚标记中的“#x”。所以，几乎准备好......现在你唯一要做的就是在关闭身体标签之前提供以下脚本...... $（'a [href ^ =“＃x”]'）。on（'click'，function（event）{

var target = $( $(this).attr('href') );

if( target.length ) {
    event.preventDefault();
    $('html, body').animate({
        scrollTop: target.offset().top

    }, 16000);
}

}）;

 $('a').click(function(){
$('html, body').animate({
    scrollTop: $( $(this).attr('href') ).offset().top
}, 1000);
return false;

}）;

jQuery（function（）{ jQuery（'a [href * =＃]：not（[href =＃]）'）。click（function（）{ if（location.pathname.replace（/ ^ //，''）== this.pathname.replace（/ ^ //，''）＆amp;＆amp; location.hostname == this.hostname）{

  var target = jQuery(this.hash);
  target = target.length ? target : jQuery('[name=' + this.hash.slice(1) +']');
  if (target.length) {
    jQuery('html,body').animate({
      scrollTop: target.offset().top -70
    }, 1000);
    return false;
  }
}

}）; }）;

Answer 2

有几个jQuery-Plugins来检查元素是否滚动到视图中，例如 jQuery.inview。
由于我已经回答了类似的问题，并且不想复制之前给出的答案，请在此处查找更多信息：jquery knob animate on load section

这个答案提供了小提琴：jQuery knob animate using jQuery.inview 使用此代码：

 $(function () {
  $('.dial').knob({
     min: '0',
     max: '100',
     readOnly: true
  });
});

startKnob =  function() {
  $('.dial').animate({
      value: $('.dial').data('number')
  },{
      duration: 950,
      easing: 'swing',
      progress: function () {
                 $('.dial').val(Math.round(this.value)).trigger('change');
     }
 });
}

$('.startKnob').bind('inview', startKnob);

从0滚动到特定值时，jQuery Knob动画

2 个答案: