我使用Picturefill 1.2并且由于存在滚动条而在不同平台/浏览器上调整大小时会出现问题。
我有以下代码:
<span data-picture data-alt="Image">
<span data-src="images/banner-01-sml.jpg"></span>
<span data-src="images/banner-01-med.jpg" data-media="(min-width: 768px)"></span>
<span data-src="images/banner-01-lrg.jpg" data-media="(min-width: 1024px)"></span>
<span data-src="images/banner-01-wide.jpg" data-media="(min-width: 1200px)"></span>
<!--[if (lt IE 9) & (!IEMobile)]>
<span data-src="images/banner-01-lrg.jpg"></span>
<![endif]-->
<!-- Fallback content for non-JS browsers. -->
<noscript>
<img alt="Image" src="images/banner-01-sml.jpg">
</noscript>
以上在Mac上正确触发,因为它没有显示滚动条,但在Windows上使用滚动条查看时它没有正确触发。我使用带有17px滚动条的Chrome,所以当我将值更改为785px,1041px和1217px时,它会在Windows上正确激活但不会在Mac上激活。
有没有人有任何建议让这项工作?或者有人知道版本2是否适合这个?
非常感谢任何帮助。
谢谢, 杰斯