Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Already on GitHub? Sign in to your account

Fix return value of elem.css('background-position') #748

Closed
wants to merge 6 commits into
from
View
@@ -8,7 +8,9 @@ var curCSS, iframe, iframeDoc,
rnumnonpx = /^-?(?:\d*\.)?\d+(?!px)[^\d\s]+$/i,
rrelNum = /^([\-+])=([\-+.\de]+)/,
rmargin = /^margin/,
+ rmultiplebg = /,\s?/,
elemdisplay = {},
+
cssShow = { position: "absolute", visibility: "hidden", display: "block" },
cssExpand = jQuery.cssExpand,
@@ -139,6 +141,33 @@ jQuery.extend({
return elem.style.opacity;
}
}
+ },
+
+ backgroundPosition: {
+ get: function( elem, computed ) {
+ if ( !computed ) {
+ return elem.style.backgroundPosition;
@mikesherov

mikesherov Jun 8, 2012

Member

over here you can just say return; without a value, and it'll know to look up the property normally.

+ }
+
+ var posY, glue, i, len,
+ propName = "backgroundPosition",
+ ret = curCSS( elem, propName );
+
+ if ( ret !== "0% 0%" ) {
+ return ret;
+ }
+
+ ret = curCSS( elem, propName + "X" );
+ posY = curCSS( elem, propName + "Y" ).split( rmultiplebg );
+ glue = rmultiplebg.exec( ret ) || [""];
+ ret = ret.split( rmultiplebg );
+
+ for ( i = 0, len = ret.length; i < len; ++i ) {
+ ret[i] += " " + posY[i];
+ }
+
+ return ret.join( glue[0] );
+ }
}
},
View
@@ -779,3 +779,19 @@ test( "cssHooks - expand", function() {
});
});
+
+test( "css('backgroundPosition') should be valid value", function() {
+ jQuery( "<style type='text/css'>" +
+ "#test-backgroundPosition {background-position: 10px 20px;}" +
+ "#test-backgroundPositionCSS3 {background-position: 10px 20px, 30px 40px;}" +
+ "</style>" ).appendTo( "head" );
+
+ jQuery( "<div id='test-backgroundPosition' style='background-color:#FFF' />" ).appendTo( "#qunit-fixture" );
+ notEqual( jQuery( "#test-backgroundPosition" ).css( "backgroundPosition" ), "0% 0%", "css('background-position') expands properly with not 0% 0%" );
+
+ // This test case is only supported in IE9
+ if ( document.documentMode && document.documentMode === 9 ) {
+ jQuery( "<div id='test-backgroundPositionCSS3' style='background-color:#FFF' />" ).appendTo( "#qunit-fixture" );
+ equal( jQuery( "#test-backgroundPositionCSS3" ).css( "backgroundPosition" ), "10px 20px, 30px 40px", "css('background-position') of CSS3 expands properly with 10px 20px, 30px 40px" );
+ }
+});