This is what I would propose to solve your problems :
var stage = new Kinetic.Stage({
container: 'container',
width: 700,
height: 300
});
var layer = new Kinetic.Layer();
var rect = new Kinetic.Rect({
x: 100,
y: 100,
width: 100,
height: 50,
fill: 'green',
stroke: 'black',
strokeWidth: 2,
draggable: true
});
layer.add(rect);
stage.add(layer);
document.getElementById('run').addEventListener('click', function() {
var tween = new Kinetic.Tween({
node: rect,
x: 200,
y: 200,
rotation: 0,
duration:5
});
tween.play();
}, false);
Just instantiate the Tween transition at the moment, you want to use it. Otherwise, the transition will start with the position at the moment you instantiated it.
Here is the fork of your fiddle with my proposal : http://jsfiddle.net/kMvzy/