From 40c008872154965d7572cda7911d42857e9fc3a9 Mon Sep 17 00:00:00 2001 From: David Murdoch Date: Thu, 26 May 2011 14:22:12 +0000 Subject: [PATCH] Fix visual test in IE6 and move the new helper functions for getting scrollbar properties to $.position --- tests/unit/position/position_core_within.js | 37 ++++----------------- tests/visual/position/position_within.html | 9 ++++- ui/jquery.ui.position.js | 15 +++++---- 3 files changed, 23 insertions(+), 38 deletions(-) diff --git a/tests/unit/position/position_core_within.js b/tests/unit/position/position_core_within.js index 9c563b1a2..567c17192 100644 --- a/tests/unit/position/position_core_within.js +++ b/tests/unit/position/position_core_within.js @@ -4,31 +4,6 @@ function scrollTopSupport() { $( window ).scrollTop( 1 ); return $( window ).scrollTop() === 1; } -function getScrollbarWidth() { - var div = $( "
" ), - innerDiv = div.children()[0], - w1, w2; - $( "body" ).append( div ); - w1 = innerDiv.offsetWidth; - div.css( "overflow", "scroll" ); - - w2 = innerDiv.offsetWidth; - - if ( w1 === w2 ) { - w2 = div[0].clientWidth; - } - - div.remove(); - - return w1 - w2; -} -function getScrollInfo ( within ) { - var that = within[0], - scrollHeight = within.height() < that.scrollHeight, - scrollWidth = within.width() < that.scrollWidth, - scrollbarWidth = getScrollbarWidth(); - return { height : scrollHeight ? scrollbarWidth : 0, width : scrollWidth ? scrollbarWidth : 0 }; -}; module( "position - within", { setup: function(){ @@ -301,7 +276,7 @@ test( "collision: fit, no offset", function() { collisionTest({ collision: "fit" - }, { top: addTop + within.height() - 10 - getScrollInfo( within ).height, left: addLeft + within.width() - 10 - getScrollInfo( within ).width }, "right bottom" ); + }, { top: addTop + within.height() - 10 - $.position.getScrollInfo( within ).height, left: addLeft + within.width() - 10 - $.position.getScrollInfo( within ).width }, "right bottom" ); collisionTest2({ collision: "fit" @@ -315,7 +290,7 @@ test( "collision: fit, with offset", function() { collisionTest({ collision: "fit", at: "right+2 bottom+3" - }, { top: addTop + within.height() - 10 - getScrollInfo( within ).height, left: addLeft + within.width() - 10 - getScrollInfo( within ).width }, "right bottom"); + }, { top: addTop + within.height() - 10 - $.position.getScrollInfo( within ).height, left: addLeft + within.width() - 10 - $.position.getScrollInfo( within ).width }, "right bottom"); collisionTest2({ collision: "fit", @@ -340,7 +315,7 @@ test( "collision: fit, within scrolled", function() { collisionTest2({ collision: "fit", at: "right+100 bottom+100" - }, { top: addTop + within.height() - 10 - getScrollInfo( within ).height, left: addLeft + within.width() - 10 - getScrollInfo( within ).width }, "right bottom" ); + }, { top: addTop + within.height() - 10 - $.position.getScrollInfo( within ).height, left: addLeft + within.width() - 10 - $.position.getScrollInfo( within ).width }, "right bottom" ); within.scrollTop( 0 ).scrollLeft( 0 ); } }); @@ -414,7 +389,7 @@ test( "collision: fit, with margin", function() { collisionTest({ collision: "fit" - }, { top: addTop + within.height() - 20 - getScrollInfo( within ).height, left: addLeft + within.width() - 20 - getScrollInfo( within ).width }, "right bottom" ); + }, { top: addTop + within.height() - 20 - $.position.getScrollInfo( within ).height, left: addLeft + within.width() - 20 - $.position.getScrollInfo( within ).width }, "right bottom" ); collisionTest2({ collision: "fit" @@ -427,7 +402,7 @@ test( "collision: fit, with margin", function() { collisionTest({ collision: "fit" - }, { top: addTop + within.height() - 20 - getScrollInfo( within ).height, left: addLeft + within.width() - 20 - getScrollInfo( within ).width }, "right bottom" ); + }, { top: addTop + within.height() - 20 - $.position.getScrollInfo( within ).height, left: addLeft + within.width() - 20 - $.position.getScrollInfo( within ).width }, "right bottom" ); collisionTest2({ collision: "fit" @@ -440,7 +415,7 @@ test( "collision: fit, with margin", function() { collisionTest({ collision: "fit" - }, { top: addTop + within.height() - 25 - getScrollInfo( within ).height, left: addLeft + within.width() - 25 - getScrollInfo( within ).width }, "right bottom" ); + }, { top: addTop + within.height() - 25 - $.position.getScrollInfo( within ).height, left: addLeft + within.width() - 25 - $.position.getScrollInfo( within ).width }, "right bottom" ); collisionTest2({ collision: "fit" diff --git a/tests/visual/position/position_within.html b/tests/visual/position/position_within.html index a20ae7b56..ac1009d3e 100644 --- a/tests/visual/position/position_within.html +++ b/tests/visual/position/position_within.html @@ -22,6 +22,9 @@ /* force scroll bar*/ min-height:800px; min-width:800px; + + /* IE6 needs this */ + text-align:center; } .demo-description { text-align:center; @@ -29,8 +32,10 @@ } .demo-container { background:#aaa; - width:80%; + width:80%; height:80%; + + text-align:left; margin:0 auto; position:relative; padding:10px; @@ -40,6 +45,8 @@ overflow:hidden; position:relative; height:100%; + /* IE6 needs this */ + width:100%; } #parent { width: 60%; diff --git a/ui/jquery.ui.position.js b/ui/jquery.ui.position.js index e254ff9ff..5ebff5d16 100644 --- a/ui/jquery.ui.position.js +++ b/ui/jquery.ui.position.js @@ -17,8 +17,10 @@ var rhorizontal = /left|center|right/, rposition = /^\w+/, rpercent = /%$/, center = "center", - _position = $.fn.position, - getScrollbarWidth = function() { + _position = $.fn.position; + +$.position = { + scrollbarWidth : function() { var div = $( "
" ), innerDiv = div.children()[0], w1, w2; @@ -36,13 +38,14 @@ var rhorizontal = /left|center|right/, return w1 - w2; }, - getScrollInfo = function( within ) { + getScrollInfo : function( within ) { var that = within[0], scrollHeight = within.height() < that.scrollHeight, scrollWidth = within.width() < that.scrollWidth, - scrollbarWidth = getScrollbarWidth(); + scrollbarWidth = $.position.scrollbarWidth(); return { height : scrollHeight ? scrollbarWidth : 0, width : scrollWidth ? scrollbarWidth : 0 }; - }; + } +}; $.fn.position = function( options ) { if ( !options || !options.of ) { @@ -145,7 +148,7 @@ $.fn.position = function( options ) { elemHeight = elem.outerHeight(), marginLeft = parseInt( $.curCSS( this, "marginLeft", true ) ) || 0, marginTop = parseInt( $.curCSS( this, "marginTop", true ) ) || 0, - scrollInfo = getScrollInfo( within ), + scrollInfo = $.position.getScrollInfo( within ), collisionWidth = elemWidth + marginLeft + ( parseInt( $.curCSS( this, "marginRight", true ) ) || 0 ) + scrollInfo.width, collisionHeight = elemHeight + marginTop + -- 2.39.5