Using pageYOffset & pageXOffset

src/generators/nodes/Window.ts

@@ -158,10 +158,10 @@ export default class Window extends Node {
 					clearTimeout(${timeout});
 					var x = ${bindings.scrollX
 						? `#component.get("${bindings.scrollX}")`
-						: `window.scrollX`};
+						: `window.pageXOffset || window.scrollX`};
 					var y = ${bindings.scrollY
 						? `#component.get("${bindings.scrollY}")`
-						: `window.scrollY`};
+						: `window.pageYOffset || window.scrollY`};
 					window.scrollTo(x, y);
 					${timeout} = setTimeout(${clear}, 100);
 				}
@@ -182,7 +182,7 @@ export default class Window extends Node {
 				#component.observe("${bindings.scrollX || bindings.scrollY}", function(${isX ? 'x' : 'y'}) {
 					${lock} = true;
 					clearTimeout(${timeout});
-					window.scrollTo(${isX ? 'x, window.scrollY' : 'window.scrollX, y'});
+					window.scrollTo(${isX ? 'x, window.pageYOffset || window.scrollY' : 'window.pageXOffset || window.scrollX, y'});
 					${timeout} = setTimeout(${clear}, 100);
 				});
 			`);

test/js/samples/window-binding-scroll/expected-bundle.js

@@ -198,7 +198,7 @@ function create_main_fragment(state, component) {
 		window_updating = true;
 
 		component.set({
-			y: this.scrollY
+			y: this.pageYOffset || this.scrollY
 		});
 		window_updating = false;
 	}
@@ -207,7 +207,7 @@ function create_main_fragment(state, component) {
 	component.observe("y", function(y) {
 		window_updating = true;
 		clearTimeout(window_updating_timeout);
-		window.scrollTo(window.scrollX, y);
+		window.scrollTo(window.pageXOffset || window.scrollX, y);
 		window_updating_timeout = setTimeout(clear_window_updating, 100);
 	});
 
@@ -243,7 +243,7 @@ function create_main_fragment(state, component) {
 function SvelteComponent(options) {
 	init(this, options);
 	this._state = assign({}, options.data);
-	this._state.y = window.scrollY;
+	this._state.y = window.pageYOffset || window.scrollY;
 
 	this._fragment = create_main_fragment(this._state, this);
 

test/js/samples/window-binding-scroll/expected.js

@@ -9,7 +9,7 @@ function create_main_fragment(state, component) {
 		window_updating = true;
 
 		component.set({
-			y: this.scrollY
+			y: this.pageYOffset || this.scrollY
 		});
 		window_updating = false;
 	}
@@ -18,7 +18,7 @@ function create_main_fragment(state, component) {
 	component.observe("y", function(y) {
 		window_updating = true;
 		clearTimeout(window_updating_timeout);
-		window.scrollTo(window.scrollX, y);
+		window.scrollTo(window.pageXOffset || window.scrollX, y);
 		window_updating_timeout = setTimeout(clear_window_updating, 100);
 	});
 
@@ -54,7 +54,7 @@ function create_main_fragment(state, component) {
 function SvelteComponent(options) {
 	init(this, options);
 	this._state = assign({}, options.data);
-	this._state.y = window.scrollY;
+	this._state.y = window.pageYOffset || window.scrollY;
 
 	this._fragment = create_main_fragment(this._state, this);
 

test/runtime/samples/window-bind-scroll-update/_config.js

@@ -2,10 +2,10 @@ export default {
 	skip: true, // JSDOM
 
 	test ( assert, component, target, window ) {
-		assert.equal( window.scrollY, 0 );
+		assert.equal( window.pageYOffset || window.scrollY, 0 );
 
 		component.set({ scrollY: 100 });
-		assert.equal( window.scrollY, 100 );
+		assert.equal( window.pageYOffset || window.scrollY, 100 );
 
 		component.destroy();
 	}