首页 > 解决方案 > jQuery DrawSVG:滚动绘制完成时调用函数?

问题描述

我正在使用Leonardo Santos 的jQuery DrawSVG在页面上绘制一个简单SVG path的页面,因为页面正在滚动。

一旦完全绘制了路径,我希望能够调用一个函数。

这是在滚动上绘制路径的脚本:

var $doc = $(document),
  $win = $(window),
  $svg = $("#Layer_1").drawsvg({
    stagger: 0
  }),
  max = $doc.height() - $win.height();

$win.on("scroll", function() {
  var p = $win.scrollTop() / max;
  $svg.drawsvg("progress", p);
});

DrawSVG 提供了一个内置选项,用于在路径的动画绘制完成后触发回调:

var $svg = $("svg").drawsvg({
  callback: function() {
    // do something
  }
});

我可以在滚动上做同样的/类似的事情吗?

标签: javascriptjquerysvgcallback

解决方案


这个怎么样?

$win.on("scroll", function() {
  var p = $win.scrollTop() / max;
  $svg.drawsvg("progress", p);
  if (p >= 1)
    myCallbackFunction();
});

推荐阅读