background-size-polyfill icon indicating copy to clipboard operation
background-size-polyfill copied to clipboard

Published 20 hours ago • verified publisher icon louisremi

Image does not appear

Open abidingbear opened this issue 11 years ago • 12 comments

I cannot seem to get the polyfill to work. When viewed in ie8 the background image is not appearing. Any advice you can give would be appreciated.

abidingbear avatar May 14 '13 19:05 abidingbear

Can you post a link?

jefferyto avatar Aug 12 '13 10:08 jefferyto

I'm having the same issue, somewhat related to https://github.com/louisremi/background-size-polyfill/issues/11

IE8 says that there's a bunch of invalid arguments and wont display the pictures.

xavio avatar Aug 22 '13 08:08 xavio

@xavio Can you try version 0.2.0 to see if it makes any difference?

jefferyto avatar Aug 27 '13 17:08 jefferyto

i have the same issue, but the image appears if i resize the browser window.

codeofsumit avatar Dec 04 '13 14:12 codeofsumit

@Sumit8 Can you post a link or jsFiddle with your issue?

jefferyto avatar Dec 05 '13 07:12 jefferyto

unfortunately i can't give you access to the current project and as we're finalizing it right now, i don't have time to build a jsFiddle just yet (also, how to test jsFiddle-content in IE8? The site does not work there). But i'll defenitely give more feedback regarding this issue after this project

codeofsumit avatar Dec 05 '13 12:12 codeofsumit

Same problem here but it only occurs when you have the background element in a div which is hidden and displayed later on. I created a Fiddle but I can't open it in IE so here is the simple output (test.html): (it occurs in IE 9 and below)

p.s. backgroundsize.min.htc must be in the same folder as test.html

<script type='text/javascript' src='https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js'></script>
<script>function test(){$('#test').fadeIn();}</script>
<div style="background-image:url(http://s2.djyimg.com/n3/eet-content/uploads/2013/11/GOLD-TREE-shutterstock-119376553-WEBONLY.jpg);width:300px;height:180px;-webkit-background-size:cover;-moz-background-size:cover;background-size: cover;background-repeat:no-repeat;-ms-behavior: url(backgroundsize.min.htc);behavior: url(backgroundsize.min.htc);"></div>
<div id="test" style="display:none;position:relative;">
    <div style="background-image:url(http://www.tea4you.nl/media/catalog/product/cache/2/thumbnail/500x500/9df78eab33525d08d6e5fb8d27136e95/d/i/diverse-fruit_21.jpg);width:300px;height:180px;-webkit-background-size:cover;-moz-background-size:cover;background-size: cover;background-repeat:no-repeat;-ms-behavior: url(backgroundsize.min.htc);behavior: url(backgroundsize.min.htc);"></div>
</div>
<a onmouseover="javascript:test();">Hover here</a>

timtempel avatar Jan 23 '14 11:01 timtempel

@timtempel does this help? https://github.com/louisremi/background-size-polyfill/issues/31#issuecomment-27583864

jefferyto avatar Jan 23 '14 13:01 jefferyto

Sorry, my bad! I didn't browse through the closed section, it's fixed now. Thank you!

timtempel avatar Jan 23 '14 13:01 timtempel

Great work by the way!

timtempel avatar Jan 23 '14 15:01 timtempel

@timtempel thanks :-) I should probably include that info in the README or somewhere more visible

jefferyto avatar Jan 23 '14 17:01 jefferyto

有人解决这个问题么，我在css中也用了"-ms-behavior: url(css/backgroundsize.min.htc), behavior: url(css/backgroundsize.min.htc ，也执行了，就是页面上是没有任何图片的

sunxiaoyun21 avatar May 19 '17 06:05 sunxiaoyun21