Принимая во внимание ширину полосы прокрутки при использовании Picturefill v1.2

Я использую 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 с полосами прокрутки он срабатывает неправильно. Я использую Chrome с 17px прокруткой, поэтому, когда я изменяю значения на 785px, 1041px и 1217px, он корректно срабатывает в Windows, но не на Mac.

У кого-нибудь есть предложения сделать эту работу? Или кто-нибудь знает, обслуживает ли версия 2 это?

Любая помощь очень ценится.

Спасибо джесс

0 ответов

Другие вопросы по тегам