用window.location.href做頁面跳轉,怎麼在新頁面載入完全之前實現loading效果?
如果是我的話,我會這樣做:1、可以在window.location.href跳轉的頁裡面本身加loading效果。 2、如果沒變法修改window.location.href跳轉頁面的內容,我會用ajax請求頁面,將html插入到當前頁面,在請求頁面的時間loading。
location.href跳轉是會導致頁面完全刷新的,這已經和之前的頁面無關。
頁面是從上到下解析的,將loading放在上部,自然會被優先加載,但如果使用的是圖片,圖片的下載是異步進行,所以還是無法把控順序,可能會一閃而過。
如果要看到,可以使用非圖片的loading,然後先把其他內容隱藏,只出現loading,等載入完全觸發ready後再顯示。
使用window.location.href去完成页面的跳转,这是瞬发的,所以在跳转页(A)做loading是不靠譜的。
window.location.href
loading
那麼loading效果是应该放到被跳转页(B)来做。但是img标签src属性是异步的,如果不是用js去控制的话,那么这时你也无法保证img加载的时间,这个时候可以试着用直接写进模板文件当中的css的loading效果来做,等页面加载完了之后关掉css的loading效果。
img
src
js
css
你這個有相容性要求麼?可以在跳轉也加上一個loading 層,用js 控制一下我寫了個範例:https://www.mnzld.net/demo/lo...
如果是我的話,我會這樣做:
1、可以在window.location.href跳轉的頁裡面本身加loading效果。
2、如果沒變法修改window.location.href跳轉頁面的內容,我會用ajax請求頁面,將html插入到當前頁面,在請求頁面的時間loading。
location.href跳轉是會導致頁面完全刷新的,這已經和之前的頁面無關。
頁面是從上到下解析的,將loading放在上部,自然會被優先加載,但如果使用的是圖片,圖片的下載是異步進行,所以還是無法把控順序,可能會一閃而過。
如果要看到,可以使用非圖片的loading,然後先把其他內容隱藏,只出現loading,等載入完全觸發ready後再顯示。
使用
window.location.href
去完成页面的跳转,这是瞬发的,所以在跳转页(A)做loading
是不靠譜的。那麼
loading
效果是应该放到被跳转页(B)来做。但是img
标签src
属性是异步的,如果不是用js
去控制的话,那么这时你也无法保证img
加载的时间,这个时候可以试着用直接写进模板文件当中的css
的loading
效果来做,等页面加载完了之后关掉css
的loading
效果。你這個有相容性要求麼?可以在跳轉也加上一個loading 層,用js 控制一下
我寫了個範例:
https://www.mnzld.net/demo/lo...