Rumah > hujung hadapan web > tutorial js > JS Loading功能的简单实现_javascript技巧

JS Loading功能的简单实现_javascript技巧

WBOY
Lepaskan: 2016-05-16 17:11:46
asal
873 orang telah melayarinya

我们经常在浏览网页的时候会看到数据在加载时,出现的LOADING提示。其实这个功能原理是很简单的,就是一个DIV遮盖当前页面,然后Loading就在遮盖DIV层上展示出来,现在我们来动手实现一下。

1.当前页面:

复制代码 代码如下:

2.遮罩层:
复制代码 代码如下:



3.Loading展示层:
复制代码 代码如下:



整体代码:
复制代码 代码如下:




   
   
   


   
   

   




最终效果:

在网上还看到另外一种实现方式,感觉思路不错,就是利用JS不断的改变html标签的value值,达到加载提示的效果,根据他的思路我自己实现了下,代码如下:

复制代码 代码如下:




   
   
   
   


   
       
           
       
       
           
       
   

               

               




最终效果:

Label berkaitan:
sumber:php.cn
Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Tutorial Popular
Lagi>
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan