iPhone上的jQuery淡出圖像問題

我希望我的網站上的縮略圖在加載時淡入，而不是加載傳統方式。我使用jQuery每個IMG的不透明度設置爲在CSS 0來實現這一點，那麼使用jQuery像這樣逐漸把它高達1：iPhone上的jQuery淡出圖像問題

image.bind("load", function() { $(this).fadeTo(1000, 1); });

這工作正常，在桌面瀏覽器，但在移動Safari或iPhone上的Chrome瀏覽器，圖像的淡入淡出就好像加載和淡入淡出都是在同一個線程中執行的，並且加載會阻止該動畫。我懷疑這可能正是發生了什麼事情，我只能忍受它，但我在這裏張貼，希望有人有一個黑客或聰明的方式。

我試圖用不透明的div覆蓋每個圖像，並將其淡入透明，但它會產生相同的結果。

你可以看到它在行動：http://www.anthonyburns.co.uk

來源

2012-10-22 littlecharva

嘗試'.fadeIn（1000）' – jsweazy

.fadeIn（）根本不工作 - 我認爲它期望顯示：沒有爲fadeIn（）工作，但我需要我的IMG設置爲顯示：塊 - 因此我設置不透明度爲0，然後使用fadeTo（）。 – littlecharva

聽起來像使用.fadeTo（）您有幀率問題

我會建議使用內置的Safari瀏覽器CSS3過渡效果得到那該多好順利褪色在你正在尋找：https://developer.apple.com/library/safari/#documentation/InternetWeb/Conceptual/SafariVisualEffectsProgGuide/Introduction.html

來源

2012-10-22 18:06:42 adamb

輝煌！完美的作品，爲了完整起見，我使用了下面的文章來檢測是否支持轉換，如果不支持，則返回jQuery：http://technology.razorfish.com/2010/02/08/detecting-css-transitions使用 - 支持-的JavaScript / – littlecharva

iPhone上的jQuery淡出圖像問題

回答

相關問題