Question

我是航点的新手并且没有让它工作

这是我的HTML

<section class="progress center" id="progress">
<h3>Skills</h3>
<div class="bars">
    <div class="progressbar">
        <h4>Concepting & Research</h4>
        <progress value="75" max="100" class="bar"></progress>
    </div>
    <div class="progressbar">
        <h4>UX design</h4>
        <progress value="85" max="100" class="bar"></progress>
    </div>
    <div class="progressbar">
        <h4>Sketch</h4>
        <progress value="90" max="100" class="bar"></progress>
    </div>
    <div class="progressbar">
        <h4>Framer</h4>
        <progress value="60" max="100" class="bar"></progress>
    </div>
    <div class="progressbar">
        <h4>HTML5 & CSS</h4>
        <progress value="65" max="100" class="bar"></progress>
    </div>
</div>

这是我想在进度条进入视口时触发的JQuery函数

$(function() {
  $(".bar").each(function() {
    var fill = $(this).val();
    $(this).val(0).animate({value: fill}, {duration: 750});
  });
});

我尝试了这个，但它没有工作

var waypoint = new Waypoint({
  element: document.getElementById('progress'),
  handler: $(function() {
    $(".bar").each(function() {
      var fill = $(this).val();
      $(this).val(0).animate({value: fill}, {duration: 750});
    });
  })});

Answer 1

var data = coveragedetailjson

如何使用航点

1 个答案: