Position: Use absolute positioning when getting scrollbar width to avoid reflows of user content. Fixes #9291 - Position - $.position.scrollbarWidth detection causes layout issues.

scottgonzalez · scottgonzalez · commit d500e945a46c · 2013-05-16T08:34:04.000-04:00
diff --git a/ui/jquery.ui.position.js b/ui/jquery.ui.position.js
@@ -70,7 +70,7 @@ $.position = {
 			return cachedScrollbarWidth;
 		}
 		var w1, w2,
-			div = $( "<div style='display:block;width:50px;height:50px;overflow:hidden;'><div style='height:100px;width:auto;'></div></div>" ),
+			div = $( "<div style='display:block;position:absolute;width:50px;height:50px;overflow:hidden;'><div style='height:100px;width:auto;'></div></div>" ),
 			innerDiv = div.children()[0];
 
 		$( "body" ).append( div );

Original file line number	Diff line number	Diff line change
`@@ -70,7 +70,7 @@ $.position = {`
`70`	`70`	`return cachedScrollbarWidth;`
`71`	`71`	`}`
`72`	`72`	`var w1, w2,`
`73`		`- div = $( "<div style='display:block;width:50px;height:50px;overflow:hidden;'><div style='height:100px;width:auto;'></div></div>" ),`
	`73`	`+ div = $( "<div style='display:block;position:absolute;width:50px;height:50px;overflow:hidden;'><div style='height:100px;width:auto;'></div></div>" ),`
`74`	`74`	`innerDiv = div.children()[0];`
`75`	`75`
`76`	`76`	`$( "body" ).append( div );`