recherche

Maison  >  Article  >  interface Web  >  JS Loading功能的简单实现_javascript技巧

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

WBOY
WBOYoriginal
2016-05-16 17:11:46861parcourir

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

1.当前页面：

复制代码 代码如下:

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



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



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




   
   
   


   
Loading

   

   




最终效果：

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

复制代码 代码如下:




   
   
   
   


   
       
           
       
       
           
       
   

               

               




最终效果：

Déclaration：
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Article précédent：根据表格中的某一列进行排序的javascript代码_javascript技巧Article suivant：JS取文本框中最小值的简单实例_javascript技巧

Articles Liés

Voir plus