getting a background-position #2213

ibolmo opened this Issue Jan 19, 2012 · 0 comments


None yet
1 participant

ibolmo commented Jan 19, 2012

(from Lighthouse)

If you set a background-position via CSS for a element in Firefox 2, element.getStyle('background-position') returns nothing.

It works in Firefox 3 + Safari.

(from comment)

Yes, this is the same patch as Fabian posted above. I'd add a lookup for named values so you consistently get either percentages or pixels (like the modern browsers do).

var namedPositions = { left: '0%', top: '0%', center: '50%', right: '100%', bottom: '100%' };
function getBackgroundPosition(el){
    if (Browser.Engine.trident){
        var x = el.getStyle('background-position-x'), y = el.getStyle('background-position-y');
        return (namedPositions[x] || x) + ' ' + (namedPositions[y] || y);
    } else {
        return el.getStyle('background-position');

This seems like a nice addition.
Now, conversion between percentages and pixels require that you know the size of the background-image, which requires it to load first. That makes it essential unfeasible. The addition of further options in CSS3 makes it even more complex. So, unit conversion is a won't fix for background-position.

ibolmo closed this in 1e400ff Aug 20, 2012

@ibolmo ibolmo added a commit that referenced this issue Aug 20, 2012

@ibolmo ibolmo Merge pull request #2409 from gonchuki/fix_2213_2295
Normalize backgroundPosition, fixes #2213 and #2295

@ibolmo ibolmo added a commit to ibolmo/mootools-core that referenced this issue Feb 16, 2014

@gonchuki @ibolmo gonchuki + ibolmo Normalize backgroundPosition and ensure that backgroundPosition[XY] a…

returns something on browsers that support that extension.
Fixes #2213 and #2295
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment