document.on("click", "div", async function(evt,div) { let p = 0; let [w,h] = div.state.box("dimension"); div.paintForeground = function(graphics) { graphics.beginPath(); graphics.moveTo(w * p, 0); graphics.lineTo(w * (1 - p), h); graphics.stroke(); }; function step(progress) { p = progress; div.requestPaint(); return true; } await div.animate(step,{ease:"sine-in-out",duration:600}); div.paintForeground = null; });
Click to animate