New issue

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

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Background image does not scale with browser zoom #79

Open
lojjic opened this Issue Sep 28, 2010 · 29 comments

Comments

Projects
None yet
@lojjic
Owner

lojjic commented Sep 28, 2010

See http://css3pie.com/forum/viewtopic.php?f=3&t=183

When using the browser zoom function, the background image(s) do not get scaled to match the zoom factor.

@sebastienbarre

This comment has been minimized.

Show comment
Hide comment
@sebastienbarre

sebastienbarre Oct 29, 2010

+1, would love to see that fixed.
Actually even at 100%, my background image doesn't quite render the same when PIE is on or off. When it's on, the first column of pixels is shifted to the left, and appears to the right.

sebastienbarre commented Oct 29, 2010

+1, would love to see that fixed.
Actually even at 100%, my background image doesn't quite render the same when PIE is on or off. When it's on, the first column of pixels is shifted to the left, and appears to the right.

@zekefarwell

This comment has been minimized.

Show comment
Hide comment
@zekefarwell

zekefarwell Dec 5, 2010

Would also love to see this fixed. Then we could starting using PIE on our site immediately.

zekefarwell commented Dec 5, 2010

Would also love to see this fixed. Then we could starting using PIE on our site immediately.

@sebastienbarre

This comment has been minimized.

Show comment
Hide comment
@sebastienbarre

sebastienbarre Dec 6, 2010

Not in PIE 1.0b3 I guess...

sebastienbarre commented Dec 6, 2010

Not in PIE 1.0b3 I guess...

@evanleck

This comment has been minimized.

Show comment
Hide comment
@evanleck

evanleck Jan 19, 2011

Same problem.

evanleck commented Jan 19, 2011

Same problem.

@wheresrhys

This comment has been minimized.

Show comment
Hide comment
@wheresrhys

wheresrhys Feb 2, 2011

still getting same problem with latest beta version

wheresrhys commented Feb 2, 2011

still getting same problem with latest beta version

@mkchandler

This comment has been minimized.

Show comment
Hide comment
@mkchandler

mkchandler Apr 13, 2011

Do any of you have some example markup or a URL that I can look at this is having this issue? I'm having some trouble recreating it on my machine.

EDIT: Nevermind! I got it to break on my machine. Hopefully a fix will be ready soon!

mkchandler commented Apr 13, 2011

Do any of you have some example markup or a URL that I can look at this is having this issue? I'm having some trouble recreating it on my machine.

EDIT: Nevermind! I got it to break on my machine. Hopefully a fix will be ready soon!

@hsimon

This comment has been minimized.

Show comment
Hide comment
@hsimon

hsimon Jun 8, 2011

is there any fix or a workaround available for this problem?

hsimon commented Jun 8, 2011

is there any fix or a workaround available for this problem?

@mkchandler

This comment has been minimized.

Show comment
Hide comment
@mkchandler

mkchandler Jun 8, 2011

@hsimon There is not a fix yet (mostly because of lack of working on the issue.) I will try to put my focus back on this and get a patch going.

mkchandler commented Jun 8, 2011

@hsimon There is not a fix yet (mostly because of lack of working on the issue.) I will try to put my focus back on this and get a patch going.

@hsimon

This comment has been minimized.

Show comment
Hide comment
@hsimon

hsimon Jun 9, 2011

@mkchandler cool, that'd be awesome! thank you so much

hsimon commented Jun 9, 2011

@mkchandler cool, that'd be awesome! thank you so much

@artifactdev

This comment has been minimized.

Show comment
Hide comment
@artifactdev

artifactdev Jun 20, 2011

Hopefully this could be fixed soon, so I wouldn't have to kick pie out of the project I'm working on.

artifactdev commented Jun 20, 2011

Hopefully this could be fixed soon, so I wouldn't have to kick pie out of the project I'm working on.

@pplschmp

This comment has been minimized.

Show comment
Hide comment
@pplschmp

pplschmp Jun 22, 2011

I am having the same issue, please oh please come up with a solution quickly. My issue is in IE7--the PIE features do not work when zoomed. It is interesting as this one works when zoomed: http://fetchak.com/ie-css3/ I would use this, but need gradient support--please help site going live soon!!!!!!!!!!!!!!!!!!!

pplschmp commented Jun 22, 2011

I am having the same issue, please oh please come up with a solution quickly. My issue is in IE7--the PIE features do not work when zoomed. It is interesting as this one works when zoomed: http://fetchak.com/ie-css3/ I would use this, but need gradient support--please help site going live soon!!!!!!!!!!!!!!!!!!!

@lojjic

This comment has been minimized.

Show comment
Hide comment
@lojjic

lojjic Jun 23, 2011

Owner

@pplschmp: you say that Fetchak's script handles zooming propertly... however when I go to that page in IE and change the zoom I see the exact same issue occur. Screenshot: http://cl.ly/15003j3B1F193S3H2g2E -- Am I missing something?

Owner

lojjic commented Jun 23, 2011

@pplschmp: you say that Fetchak's script handles zooming propertly... however when I go to that page in IE and change the zoom I see the exact same issue occur. Screenshot: http://cl.ly/15003j3B1F193S3H2g2E -- Am I missing something?

@pplschmp

This comment has been minimized.

Show comment
Hide comment
@pplschmp

pplschmp Jun 23, 2011

Ah yes, the image does tile, but at least the boxes move with the text. Sorry I missed the cat picture tiling.

pplschmp commented Jun 23, 2011

Ah yes, the image does tile, but at least the boxes move with the text. Sorry I missed the cat picture tiling.

@artifactdev

This comment has been minimized.

Show comment
Hide comment
@artifactdev

artifactdev Jul 5, 2011

Whats the actual point on this issue? I think it should be fixed soon as possible or better i hope for this.

artifactdev commented Jul 5, 2011

Whats the actual point on this issue? I think it should be fixed soon as possible or better i hope for this.

@artifactdev

This comment has been minimized.

Show comment
Hide comment
@artifactdev

artifactdev Jul 21, 2011

Sorry that I'm asking all the time but isn't there a fix in work? I think this is a fatal showstopper in relation to accessibility statement.

artifactdev commented Jul 21, 2011

Sorry that I'm asking all the time but isn't there a fix in work? I think this is a fatal showstopper in relation to accessibility statement.

lojjic pushed a commit that referenced this issue Sep 9, 2011

Jason Johnston
Partial fix for issue #79: explicitly set the size of the background …
…image fill tile in pixels so that IE will automatically adjust it to the user's zoom level.
@paulyoung

This comment has been minimized.

Show comment
Hide comment
@paulyoung

paulyoung Sep 9, 2011

Would also like to see this fixed.

paulyoung commented Sep 9, 2011

Would also like to see this fixed.

@lojjic

This comment has been minimized.

Show comment
Hide comment
@lojjic

lojjic Sep 16, 2011

Owner

For the folks following this ticket: the above commit seems to fix this issue entirely in IE8. IE7 seems to have a related zoom problem that affects the size of the entire rendering, but its background images are at least now sized consistently.

Assistance in testing this is welcomed. You'll have to pull the latest master code and build it.

Owner

lojjic commented Sep 16, 2011

For the folks following this ticket: the above commit seems to fix this issue entirely in IE8. IE7 seems to have a related zoom problem that affects the size of the entire rendering, but its background images are at least now sized consistently.

Assistance in testing this is welcomed. You'll have to pull the latest master code and build it.

@minimaldesign

This comment has been minimized.

Show comment
Hide comment
@minimaldesign

minimaldesign Oct 3, 2011

Is the fix included in 1.0beta5? I believe I just ran into this issue... Thanks!

minimaldesign commented Oct 3, 2011

Is the fix included in 1.0beta5? I believe I just ran into this issue... Thanks!

@Lyoshi

This comment has been minimized.

Show comment
Hide comment
@Lyoshi

Lyoshi Dec 23, 2011

Is there any news on this issue? Thanks in advance.

Lyoshi commented Dec 23, 2011

Is there any news on this issue? Thanks in advance.

@tobystokes

This comment has been minimized.

Show comment
Hide comment
@tobystokes

tobystokes Jan 26, 2012

This fix wasn't included in 1.0beta5 - but I just patched in d97c930 to the 1.0beta5 release to see if it works, and I can confirm it does fix for IE8. IE7 still a bit bonkers, but no worse than without this patch.
I can't push this back to the beta branch, but if anyone wants just the compiled .htc, they can get it here: http://cl.ly/1F1W1F43263m3f1h0l07

tobystokes commented Jan 26, 2012

This fix wasn't included in 1.0beta5 - but I just patched in d97c930 to the 1.0beta5 release to see if it works, and I can confirm it does fix for IE8. IE7 still a bit bonkers, but no worse than without this patch.
I can't push this back to the beta branch, but if anyone wants just the compiled .htc, they can get it here: http://cl.ly/1F1W1F43263m3f1h0l07

@kvcrawford

This comment has been minimized.

Show comment
Hide comment
@kvcrawford

kvcrawford Jan 31, 2012

Thanks for providing the HTC file--worked like a charm. Hope you guys can patch that into a new beta soon.

kvcrawford commented Jan 31, 2012

Thanks for providing the HTC file--worked like a charm. Hope you guys can patch that into a new beta soon.

lojjic added a commit that referenced this issue Feb 8, 2012

Partial fix for issue #79: explicitly set the size of the background …
…image fill tile in pixels so that IE will automatically adjust it to the user's zoom level.
@Lyoshi

This comment has been minimized.

Show comment
Hide comment
@Lyoshi

Lyoshi Apr 30, 2012

Thanks for the fix, I really appreciate it. However, this will work only on IE8. Stand-alone IE7 is still completely broken when zoomed, and it's a big issue for a serious website. We use PIE on a lots of websites with millions of users, and we are thinking about completely dropping PIE because of IE7 zoom issue, or dropping PIE support for IE7 at least, after QA Team informed us about this issue. I've tried all PIE versions, even PIE 2.0, and all versions have a same problem.

Lyoshi commented Apr 30, 2012

Thanks for the fix, I really appreciate it. However, this will work only on IE8. Stand-alone IE7 is still completely broken when zoomed, and it's a big issue for a serious website. We use PIE on a lots of websites with millions of users, and we are thinking about completely dropping PIE because of IE7 zoom issue, or dropping PIE support for IE7 at least, after QA Team informed us about this issue. I've tried all PIE versions, even PIE 2.0, and all versions have a same problem.

@lojjic

This comment has been minimized.

Show comment
Hide comment
@lojjic

lojjic Apr 30, 2012

Owner

@Lyoshi Yes we're aware that IE7 zooming is still broken, hence the term "Partial fix" in the commit message. If you are able to help fix the issue it would be greatly appreciated. Might be more cost effective for you to invest a little time helping find a fix than to completely drop your usage and switch to some other approach.

Owner

lojjic commented Apr 30, 2012

@Lyoshi Yes we're aware that IE7 zooming is still broken, hence the term "Partial fix" in the commit message. If you are able to help fix the issue it would be greatly appreciated. Might be more cost effective for you to invest a little time helping find a fix than to completely drop your usage and switch to some other approach.

@Lyoshi

This comment has been minimized.

Show comment
Hide comment
@Lyoshi

Lyoshi May 7, 2012

Unfortunately JS/VML is not my area of expertise, however I can help with testing. I didn't want to sound harsh, just wanted to point out that this particular bug is probably one of the most problematic one for big corporate websites. PIE is great and keep up the good work. Thank you.

Lyoshi commented May 7, 2012

Unfortunately JS/VML is not my area of expertise, however I can help with testing. I didn't want to sound harsh, just wanted to point out that this particular bug is probably one of the most problematic one for big corporate websites. PIE is great and keep up the good work. Thank you.

lojjic added a commit that referenced this issue May 12, 2012

@lojjic

This comment has been minimized.

Show comment
Hide comment
@lojjic

lojjic May 12, 2012

Owner

The above commit adds some adjustment for the zoom ratio in IE7's position calculations. It's not 100% accurate due to what I can only guess are rounding issues, but it's at worst a pixel or two off rather than hundreds of pixels now.

Owner

lojjic commented May 12, 2012

The above commit adds some adjustment for the zoom ratio in IE7's position calculations. It's not 100% accurate due to what I can only guess are rounding issues, but it's at worst a pixel or two off rather than hundreds of pixels now.

lojjic added a commit that referenced this issue May 12, 2012

lojjic added a commit that referenced this issue May 12, 2012

@Lyoshi

This comment has been minimized.

Show comment
Hide comment
@Lyoshi

Lyoshi May 26, 2012

Thanks a lot, Jason! Glad this fix was included in 1.0.0 release.

Lyoshi commented May 26, 2012

Thanks a lot, Jason! Glad this fix was included in 1.0.0 release.

@crohde7707

This comment has been minimized.

Show comment
Hide comment
@crohde7707

crohde7707 Aug 24, 2012

So to apply these fixes, i would have to load the extra js files? right now i am only including the PIE.htc file

crohde7707 commented Aug 24, 2012

So to apply these fixes, i would have to load the extra js files? right now i am only including the PIE.htc file

@lojjic

This comment has been minimized.

Show comment
Hide comment
@lojjic

lojjic Aug 24, 2012

Owner

@crohde7707 I don't know what you're asking -- this fix was in the 1.0.0 release, nothing additional to be done.

Owner

lojjic commented Aug 24, 2012

@crohde7707 I don't know what you're asking -- this fix was in the 1.0.0 release, nothing additional to be done.

@crohde7707

This comment has been minimized.

Show comment
Hide comment
@crohde7707

crohde7707 Aug 24, 2012

Sorry if i wasnt clear.. My issue is im loading a background-image on an element, and also adding a background-color, using pie to round the background color so it wont show behind the rounded button. But when i zoom in, it doesnt keep the image in place and pixilate it like it should, instead it shows more of the sprite image im using (or less if i zoom out). Im using 1.0.0. and im seeing this in both IE 8 and 7

crohde7707 commented Aug 24, 2012

Sorry if i wasnt clear.. My issue is im loading a background-image on an element, and also adding a background-color, using pie to round the background color so it wont show behind the rounded button. But when i zoom in, it doesnt keep the image in place and pixilate it like it should, instead it shows more of the sprite image im using (or less if i zoom out). Im using 1.0.0. and im seeing this in both IE 8 and 7

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment