JS Loading功能的簡單實作_javascript技巧
- WBOY原創
- 2016-05-16 17:11:46861瀏覽
我們常在瀏覽網頁的時候會看到資料在載入時，出現的LOADING提示。其實這個功能原理是很簡單的，就是一個DIV遮蓋當前頁面，然後Loading就在遮蓋DIV層上展示出來，現在我們來動手實現一下。
1.目前頁數：
複製程式碼 代碼如下:
複製程式碼 程式碼如下:
程式碼如下:
整體代碼:
複製代碼
複製代碼
複製代碼
複製代碼
複製代碼
程式碼如下:
.over {
display: none;
top: 0;
left: 0;
background-color: #f5f5f5;
opacity }
.layout { display: none;
最終效果：
display: none;
top: 0;
left: 0;
background-color: #f5f5f5;
opacity }
.layout { display: none;
top: 40%;
left: 40%;
%;
z-index: 1001;
最終效果：
在網路上還看到另一種實現方式，感覺思路不錯，就是利用JS不斷的改變html標籤的value值，達到加載提示的效果，根據他的思路我自己實現了下，代碼如下：
複製程式碼 程式碼如下: