Make resize triggers use default CSS writing mode

The Chromium community is moving to scroll position values indicated in
the CSSOM specification [1]. In order to launch the feature and analyze
potential broken URLs, they count pages setting the scroll position of
a scroller in non-default writing mode to a positive value. Websites
using javascript-detect-element-resize in RTL or vertical mode appear
in the top results and cause a lot of false positives [2]. In order to
avoid that, ensure that the resize triggers use the default writing
mode (direction: ltr and writing-mode: horizontal-tb).

[1] https://www.chromestatus.com/feature/5759578031521792
[2] sdecima#61

Author: fred-wang

detect-element-resize.js

@@ -92,7 +92,7 @@
 		if (!stylesCreated) {
 			//opacity:0 works around a chrome bug https://code.google.com/p/chromium/issues/detail?id=286360
 			var css = (animationKeyframes ? animationKeyframes : '') +
-					'.resize-triggers { ' + (animationStyle ? animationStyle : '') + 'visibility: hidden; opacity: 0; } ' +
+					'.resize-triggers { ' + (animationStyle ? animationStyle : '') + 'visibility: hidden; opacity: 0; direction: ltr; writing-mode: horizontal-tb; } ' +
 					'.resize-triggers, .resize-triggers > div, .contract-trigger:before { content: \" \"; display: block; position: absolute; top: 0; left: 0; height: 100%; width: 100%; overflow: hidden; } .resize-triggers > div { background: #eee; overflow: auto; } .contract-trigger:before { width: 200%; height: 200%; }',
 				head = document.head || document.getElementsByTagName('head')[0],
 				style = document.createElement('style');

jquery.resize.js

@@ -110,7 +110,7 @@
 			//opacity:0 works around a chrome bug https://code.google.com/p/chromium/issues/detail?id=286360
 			var css = (animationKeyframes ? animationKeyframes : '') +
 					'.resize-triggers { ' + (animationStyle ? animationStyle : '') + 'visibility: hidden; opacity: 0; } ' +
-					'.resize-triggers, .resize-triggers > div, .contract-trigger:before { content: \" \"; display: block; position: absolute; top: 0; left: 0; height: 100%; width: 100%; overflow: hidden; } .resize-triggers > div { background: #eee; overflow: auto; } .contract-trigger:before { width: 200%; height: 200%; }',
+					'.resize-triggers, .resize-triggers > div, .contract-trigger:before { content: \" \"; display: block; position: absolute; top: 0; left: 0; height: 100%; width: 100%; overflow: hidden; direction: ltr; writing-mode: horizontal-tb; } .resize-triggers > div { background: #eee; overflow: auto; } .contract-trigger:before { width: 200%; height: 200%; }',
 				head = document.head || document.getElementsByTagName('head')[0],
 				style = document.createElement('style');