Chrome上的jQuery animate（）37.0.2062.120 m/Webkit？

這是我在這裏的第一個問題，所以請耐心等待。我正在開發一個小型項目，最近我發現了一個以前沒有的特殊問題。Chrome上的jQuery animate（）37.0.2062.120 m/Webkit？

在項目中，我用我的祖國羅馬尼亞的不同區域進行選擇的小地圖。我使用Raphael.js庫和jQuery/UI實現了這一點。它看起來像這樣：

http://s28.postimg.org/pzg3gaiod/output_Cuap_Ye.gif

的想法是，當你選擇它會動態着色，添加到區域中的載體的區域。簡單。因此，對於每個區域（即聲明爲拉斐爾庫理解的路徑和油漆），我有一個小功能：

function clickableMinimapRegions(st, regio) { 
st[0].style.cursor = "pointer"; 
st[0].onclick = function() { 
    if ($.inArray(regio, regions) != -1) { 
    regions.splice($.inArray(regio, regions), 1); 
    st.animate({ 
    fill: "#FFFFFF" 
    }, 0); 
    } else { 
    regions.push(regio); 
    st.animate({ 
    fill: "#e6e6e6" 
    }, 0); 
    } 
}; 
}

然後，我有這樣的HTML：

<ul class="element-menu drop-up"> 
<li> 
    <a id="toggle" class="dropdown-toggle bg-lime text-shadow button shadow"> 
    <img src="../img/regions.png"> 
    </a> 
    <div id="content" class="dropdown-menu bg-steel" data-role="dropdown"> 
    <div id="minimap" class="minimap"></div> 
    </div> 
</li> 
</ul>

我使用的Metro UI CSS庫，它是一個簡單的下拉菜單。但它的行爲是在點擊時自動關閉。所以對於我所做的：

$("#minimap").click(function (event) { 
event.stopPropagation(); 
});

http://s28.postimg.org/trltqsu19/Captura3.png

此菜單在屏幕上的單張地圖的底部，地圖的背景和這個下拉是在地圖上。事情是，如果地圖沒有加載，比起來還好。如果加載了地圖圖塊，則會發生某些情況，防止點擊時區域被着色。

謝謝。

溶液中發現： Force DOM redraw/refresh on Chrome/Mac

來源

2014-09-12 enr00ted

在jQuery's .animate()第二個參數是持續時間，以毫秒爲單位。將它設置爲0後，我寧願說在其他瀏覽器中看到的行爲是錯誤的，並且您應該期望在沒有動畫的情況下立即更改屬性。

st.animate({ 
    fill: "#FFFFFF" 
    }, 0); 
    // ^---- duration

嘗試改變，爲一個更大的值（400毫秒是默認值）

這裏的顯示差異小提琴：http://jsfiddle.net/exrj973b/

來源

2014-09-12 14:17:31 blgt

@ enr00ted在一個側面說明，[拉斐爾的'elt.animate（）'的文檔（http://raphaeljs.com/reference.html#Element.animate）說同樣的事情 – blgt 2014-09-12 22:44:22

我不得不用這個，$（'＃parentOfElementToBeRedrawn'）。隱藏（）。顯示（0 ）;我也更新了我的問題的解釋，因爲現在我懷疑有重繪/刷新問題。 – enr00ted 2014-09-12 22:52:25

那麼有[這個問題]（http://stackoverflow.com/questions/8840580）哪些引用確切的重繪問題（可能你得到你的解決方案？）。如果這解決了您的問題，我建議將其標記爲重複或將其作爲答案添加到此處幷包括鏈接，如果您認爲它的相似程度不夠重複（可能對其他人有幫助） – blgt 2014-09-12 23:06:38

Chrome上的jQuery animate（）37.0.2062.120 m/Webkit？

回答

相關問題