iT邦幫忙

1

如何讓網頁換頁時沒有閃爍的感覺?

  • 分享至 

  • xImage

小弟最近在製作把RWD的網頁打包成App
在手機瀏覽時,每到換頁就會有種閃爍的感覺
因為會全白一下,再載入下一頁
有試過用Jquery的fadein、fadeout特效去處理
但是覺得還是不太順暢,有種等待很久的感覺
有推薦什麼好用的套件or方法嗎?
jquery ui與phonegap之外的
如果用Ajax的話,會有很多Javascript的部分需要更改
因為目前都寫好了,所以要換整個架構比較費工
再麻煩好心有經驗的大大分享一下您們的做法
幫助小弟一下
先謝謝各位前輩了 :)

謝謝謝謝

圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中
12
player
iT邦大師 1 級 ‧ 2016-04-11 01:58:20
最佳解答

不管你的伺服器端是用哪一種
切換頁面時通通一定會閃
除非你把整個網站都打包成SPA(Single-page application)
用AJAX在同一個頁面裡存取所有要顯示的內容
不然沒辦法避免掉閃的問題

3

先說說流程

一般來說換頁也就是再載入頁面。瀏覽器會先將目前的畫面清除。並重新載入相對應的頁面。
也就是說,會有閃的感覺就是因為這樣一個動作。
那麼~~~就很簡單啦。
其一就是不要有畫面清除的動作,等資料載入好才直接置換。(這就是ajax的技術)
其二就是,讓載入的頁面快一點。讓他無載入感。這就看個人的網速跟主機的運行速度啦!!(簡單來講,主機用好一點的線路,搞不好也可行的)

有沒有其它方式呢?認真來說。只有第一種方式比較可行而已了。因為他可以排除掉載入的時間,讓畫面不至於變成白頁。等載入完才送出頁面。(註:碰上高容量的頁面,還是會有白頁的可能性)

所以,這實在沒其它招了。你只能乖乖的使用ajax最理想了。其它招也不一定可以少改。

因為我是有其它招,只是~~~~會比你用ajax來處理的更麻煩。

1
伊恩
iT邦新手 5 級 ‧ 2017-08-14 12:12:58

除非是單頁式的,要不然避不開唷

我要發表回答

立即登入回答