episodic movement using SMIL in SVG

Question

i have an attempt at a SMIL animation of a simple SVG figure at http://jsfiddle.net/emanuensis/H68jS The idea is that every mouse over the words up or down will cause the yellow puck to move for 1 second in that direction and stop ... and await further mouse overs, from that location.

Unfortunately the reality (in both FF & Chrome) is very variable. Sometimes it seems to take the 'fill = "freeze"' attribute, sometimes it restarts all the way up or down,sometimes it restarts where it left off many iterations ago.

This is my first go at using the specs at http://www.w3.org/TR/smil-animation so i expect i have done something wrong, or left some attribute out but i cannot find out which or where.

fiddly code:

<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg id="svg2"
  xmlns="http://www.w3.org/2000/svg"
  xmlns:xlink="http://www.w3.org/1999/xlink"
  width="400" height="500"
  version="1.1">
<text id="tup" x="48 " y="33" >up  </text>
<text id="tdn" x="235" y="33" >down</text>
<rect id="trect" style="fill:yellow;stroke:red;"
    width="20" height="20" x="75" y="0" rx="5" ry="5" >
<animate id="tr"
  begin="tdn.mouseover"
  end="tdn.mouseover+1s"
  attributeName="x"
  additive="sum"
  fill = "freeze"
  restart = "whenNotActive"
  to="50"
  dur="5s"
  repeatCount="1" />
  <animate id="rt"
  begin="tup.mouseover"
  end="tup.mouseover+1s"
  attributeName="x"
  additive="sum"
  fill = "freeze"
  restart = "whenNotActive"
  to="250" dur="5s"
  repeatCount="1"/>
  </rect>
</svg>