Can't seem to get this to work properly, seem to be doing everything right from what I can see in the docs.
Uncaught TypeError: Cannot read property 'length' of undefined
at t.interpolate (dynamics.min.js:1)
at t.interpolate (dynamics.min.js:1)
at q (dynamics.min.js:1)
at m (dynamics.min.js:1)
at P (dynamics.min.js:1)
var block = $('.feature-block');
var path = $('#feature-path');
block.data('dragging', false);
block.data('c', { x: 100, y: 10 });
block.data('start', { x: 0, y: 0 });
function update() {
var dy = block.data('c').y - 10;
var dampen = dy > 0 ? 2 : 4;
block.css('transform', 'translate3d(0,' + dy / dampen + 'px,0)');
path.attr('d', 'M0,100 L100,100 L100,10 ' + 'Q' + block.data('c').x + ',' + block.data('c').y + ' 0,10');
}
update();
block.on('mousedown', function(e) {
e = e.changedTouches ? e.changedTouches[0] : e;
var $this = $(this);
$this.data('dragging', true);
$this.data('start').x = e.pageX;
$this.data('start').y = e.pageY;
});
$(document).on('mousemove', function(e) {
e = e.changedTouches ? e.changedTouches[0] : e
if (block.data('dragging') && ((e.pageY - block.position().top > -200 && e.pageY - block.position().top <= 0) || (e.pageY - block.position().top < 250 && e.pageY - block.position().top >= 0))) {
block.data('c').x = (50 + (e.pageX - block.data('start').x)/block.width())
// dampen vertical drag by a factor
var dy = e.pageY - block.data('start').y
var dampen = dy > 0 ? 20 : 20
block.data('c').y = 10 + dy / dampen
update();
}
});
$(document).on('mouseup', function(e) {
if (block.data('dragging')) {
block.data('dragging', false);
dynamics.animate(path, {
x: 100,
y: 100
}, {
type: dynamics.spring,
duration: 700,
friction: 280,
change: update
})
}
});
Can't seem to get this to work properly, seem to be doing everything right from what I can see in the docs.