網站資產隨機不加載

我坐在這裏拉我的頭髮。如果你訪問my site你應該看到這樣的事情：網站資產隨機不加載

enter image description here

的事情是，雖然，有時圖像負載，有時他們不。當我運行本地機器上的所有內容時，它可以完美運行。但是當我將它上傳到我的服務器時，圖像有時會隨機停止加載。

我注意到的是，如果你使用Chrome和你按下Ctrl + Shift + I和控制檯打開。然後，您打開控制檯刷新頁面，然後似乎使大部分時間都會加載。

2013-06-05 Tiwaz89

我現在爲我的項目使用基礎，這不應該是原因。也許你應該給我們一個在線例子。你用javascript加載圖像？ – Reko

@Reko - 我鏈接到我的文章中的活網站，請參閱「我的網站」。否則請訪問deangrobler.com。我不會用JavaScript來裝載它們，但我確實使它們可以用javascript顯示。或者至少這就是我使用的插件所理解的。 – Tiwaz89

當圖像失敗出現，問題不在於它們不是由瀏覽器加載的，而是本Freetile插件產生的圖像容器零高度和寬度，因此隱藏它們。

我認爲正在發生的事情是在執行您的Freetile代碼之前的瀏覽器已經完成加載圖像。我假設Freetile測量div的內容（在圖像加載之前它將爲零），然後確定沒有內容並應用零高度和寬度。

這就解釋了，因爲有時瀏覽器設法得到加載圖像Freetile運行，有時不是之前的結果不一致。

我的理論可以通過評論Freetile代碼並將其添加到帶有長計時器（如5秒）的setTimeout()調用來測試，因爲您知道圖像將在那時完全加載。

建議可能的解決方法：

添加Freetile執行到$(window).load()而不是$(document).ready()。差異是$(window).load()只有在所有內容全部加載時纔會觸發（包括所有圖像）。
添加一些代碼，它將偵聽圖像onload事件並等到它們全部被觸發（指示加載的所有圖像），然後執行Freetile執行。僅使用$(document).ready()是不夠的，因爲這隻意味着DOM已加載並準備就緒，並不一定意味着所有圖像都會下載並呈現。

來源

2013-06-05 10:22:57 MrCode

非常感謝您的回覆。我明白你的意思，並認爲你在正確的軌道上。我曾經嘗試過你的理論，甚至通過完全刪除Freetile來達到這個目的，但結果依然存在。我認爲正在發生的事情是，當HTML加載時，div的'懸停卡'獲得0高度和寬度，因爲他們不知道他們應該拉伸到什麼程度，因爲它們中的圖像尚未加載。這也是一個原因嗎？而修復基本上意味着事先設定'懸停卡'div的高度和寬度。 – Tiwaz89

這聽起來像是應用零高度和寬度的懸停卡代碼。我會嘗試相同的計時器測試，但延遲懸停卡代替。也可以嘗試使用'$（window）.load'作爲懸停卡，或者如果需要的話使用兩者。 – MrCode

啊，沒關係！我把freetile放在window.load中，似乎沒有馬上解決問題。然後我把所有其他插件jquery box懸停和fancybox在window.load以及似乎已經解決了這個問題:) – Tiwaz89

你也可以做的是什麼規定，像這樣的元件尺寸爲內聯CSS樣式：

<div class="myElement" style="width:100px; height:200px">Stuff</div>。

這些尺寸將被應用到該元素，因此你不必等待加載圖像。

此外，您可以在類ignore-load-check添加到您的元素和Freetile會忽略你的元素圖像檢查。 Freetile demo page提供了此功能的演示。

來源

2013-07-03 08:25:14 insys

網站資產隨機不加載

回答

相關問題