Safari 5.1上的Google Maps和jQuery動畫的奇怪問題

Question

我有一個帶有Google地圖和由我製作的滑塊的頁面，它使用簡單的水平動畫。

除了Safari 5.1（mac）裏的動畫搞砸了以外，一切都可以正常工作（它不會一路穿過）。

我發現刪除地圖（加載API v3）可以解決問題。

我設置一個的jsfiddle這樣你就可以對其進行測試：http://jsfiddle.net/tGRf6/29/ （只需點擊「下一步」，以運行滑塊）

編輯 它可能有一些做「重繪」之類的東西因爲我注意到調整窗口大小可以使幻燈片到位。

Answer 1

此更新到您的例子似乎在Safari 5.1的工作：http://jsfiddle.net/tGRf6/33/

去除div#slideroverflow:hidden固定的問題。爲了再次隱藏其他幻燈片元素，我然後圍繞<ul>圍繞<div id="innerslider">並將overflow:hidden屬性從<div id="slider">移動到新的<div>（加上一些更多的CSS）。

我仍然會（先搜索然後）用你的jsfiddle例子發佈一個bug報告，指出overflow：hidden似乎以某種方式涉及到。

希望這會有所幫助。一些

• 更換.animate（）方法：

  ---

  前來到這個潛在的解決方案我已經寫了一些意見（沒有比5.1的Safari和Firefox 7其他瀏覽器進行測試）使用setTimeout的普通JavaScript沒有改變效果。

• left屬性的非動態變化按預期工作，但是，包含地圖始終是「1單擊後」（第一次單擊將屬性更改爲-800，但沒有任何更改，第二次單擊將其設置爲 - 1600，但顯示中間的滑動元件等）。

• 將動畫持續時間降低到20會使誤差惡化，因爲「像素步長」每次迭代都會變大。同樣，它看起來最後的變化並不是「通過」。因此，當將持續時間設置爲800（1ms/px）時，該元素之後是一個像素關閉。

• 在開發者工具中輸入/遞減left的值在包含地圖時也顯示一些奇怪的效果，例如，當遞減2時，幻燈片向右移動1px，然後向後移動1px到左邊。當地圖被扔掉時，一切正常。

• 刪除滑塊div的「overflow：hidden」屬性可修復錯誤，但您必須以其他方式隱藏幻燈片（請參閱修訂後的jsfiddle）。

• 當包含地圖時，它看起來很像left屬性的最後更改未反映在呈現的頁面中。