jquery-backstretch / jquery-backstretch

Backstretch is a simple jQuery plugin that allows you to add a dynamically-resized, slideshow-capable background image to any page or element. The image will stretch to fit the page/element, and will automatically resize as the window/element size changes.
http://www.jquery-backstretch.com
MIT License
3.91k stars 908 forks source link

Photo doesn't appear in IE9 #105

Closed designbymichael closed 12 years ago

designbymichael commented 12 years ago

I'm not quite sure why, but IE9 is not displaying the background image unless I run it in Compatibility Mode.

Running: • IE9 compatibility mode OFF within a Windows 7 virtual machine on the Mac • jQuery 1.7.2 • Modernizr 2.5.3 • Foundation 2.5.2

designbymichael commented 12 years ago

Additionally, I checked the Developer Tools within IE9 to see if there were any errors being flagged and have seen none thus-far.

designbymichael commented 12 years ago

Disregard this ticket. I found the issue.

When using a gradient CSS3 value (for IE: ilter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#223c68', endColorstr='#060d1b',GradientType=0 ); ) in a stylesheet, this value trumps anything created on the fly with jQuery like the stretched photo.

I'll mark this as resolved. But if anyone else out there happens to have issues with the background photo loading in IE9 when you may have already set a default background color or gradient (to be set as a placeholder before the photo loads), be sure to set the CSS value: filter: none;. That will fix it.