diff --git a/light9/web/timeline-elements.html b/light9/web/timeline-elements.html
--- a/light9/web/timeline-elements.html
+++ b/light9/web/timeline-elements.html
@@ -190,17 +190,20 @@
            var d = svgPathFromPoints([[x1, y2], [x1*.75 + x2*.25, y1], [x1*.25 + x2*.75, y1], [x2, y2]]);
            elem.setAttribute('d', d);
        },
-       setCursor: function(y1, h1, y2, h2, zoom, cursor) {
-           var xZoomedOut = this.offsetParent.offsetWidth * cursor.t / zoom.duration;
-           var xZoomedIn = this.offsetParent.offsetWidth * (cursor.t - zoom.t1) / (zoom.t2 - zoom.t1); // replace with d3 scale
-           this.cursorPath.top.setAttribute('d', svgPathFromPoints([[xZoomedOut, y1], [xZoomedOut, y1 + h1]]));
+       setCursor: function(y1, h1, y2, h2, fullZoomX, zoomInX, cursor) {
+           var xZoomedOut = fullZoomX(cursor.t);
+           var xZoomedIn = zoomInX(cursor.t);
+           this.cursorPath.top.setAttribute('d', svgPathFromPoints([
+               [xZoomedOut, y1],
+               [xZoomedOut, y1 + h1]]));
            this.cursorPath.mid.setAttribute('d', svgPathFromPoints([
                [xZoomedIn + 2, y2 + h2],
                [xZoomedIn - 2, y2 + h2],
                [xZoomedOut - 1, y1 + h1],
-               [xZoomedOut + 1, y1 + h1],
-           ]) + ' Z');
-           this.cursorPath.bot.setAttribute('d', svgPathFromPoints([[xZoomedIn, y2 + h2], [xZoomedIn, this.offsetParent.offsetHeight]]));
+               [xZoomedOut + 1, y1 + h1]]) + ' Z');
+           this.cursorPath.bot.setAttribute('d', svgPathFromPoints([
+               [xZoomedIn, y2 + h2],
+               [xZoomedIn, this.offsetParent.offsetHeight]]));
 
        }
    });
diff --git a/light9/web/timeline.coffee b/light9/web/timeline.coffee
--- a/light9/web/timeline.coffee
+++ b/light9/web/timeline.coffee
@@ -81,7 +81,7 @@ Polymer
   behaviors: [ Polymer.IronResizableBehavior ]
   properties:
     viewState: { type: Object }
-  ready: ->
+  attached: ->
     @viewState =
       zoomSpec:
         duration: 190
@@ -90,13 +90,15 @@ Polymer
       cursor:
         t: 105
 
-    @fullZoomX = d3.scaleLinear().domain([0, @viewState.zoomSpec.duration]).range([0, @offsetWidth])
+    @fullZoomX = d3.scaleLinear().domain([0, @viewState.zoomSpec.duration]).range([0, @offsetWidth]) # need to update this if width changes or if duration changes
+    @zoomInX = d3.scaleLinear().domain([@viewState.zoomSpec.t1, @viewState.zoomSpec.t2]).range([0, @offsetWidth]) # need to update this if width changes or if duration changes
+
 
     animCursor = () => 
       @viewState.cursor.t = 130 + 20 * Math.sin(Date.now() / 2000)
       @$.dia.setCursor(@$.audio.offsetTop, @$.audio.offsetHeight,
                        @$.zoomed.$.time.offsetTop, @$.zoomed.$.time.offsetHeight,
-                       @viewState.zoomSpec, @viewState.cursor)
+                       @fullZoomX, @zoomInX, @viewState.cursor)
 
       @set('viewState.zoomSpec.t1', 80 + 10 * Math.sin(Date.now() / 3000))