jquery - Safari MAC OS X 上的 Foundation Orbit Off Center

Question

我目前有一个运行以下元素的基础轨道:

     <ul data-orbit>

          <li> 
            <img class="image1" src="../templates/img/image1.jpg" style="width: 100%;       height: 691px; margin: 0 auto;"/>   
          </li>
          <li>
             <img class="image2" src="../templates/img/image2.jpg" style="width: 100%; height: 691px; margin: 0 auto;"/>   
        </li>
         <li>
            <img class="image3" src="../templates/img/image3.jpg" style="width: 100%; height: 691px; margin: 0 auto;"/>   
        </li>
     </ul>

在 Windows 上，浏览器检查正常。但是，在 Mac OS X Safari 上，它显示下一个列表项图像，而不是显示整个 100% 宽度。

我猜这与显示的图像的实际宽度和高度不完全相同有关...？

我想尝试解决这个小问题，而不必将所有图像裁剪成相同的宽度和高度，因为它只为 mac safari 量身定制。

我试过改foundation.orbit.js改$slides.css(大约第 340 行)读取 jquery.safari 并尝试改变它的宽度，但它最终只是在 safari 上拉伸(stretch)图像。

谢谢!

Answer 1

我注意到在 MAC OS X 中，clientWidth 比它应该的短 1px(1038 而不是 1039px)。

通过在 safari 浏览器上将 CSS 的宽度强制设置为 1039px !important，它解决了这个问题。
我不知道为什么宽度被迫比实际宽度短 1px，但无论如何。