Java动态加载类(java动态加载代码)

通过java、JavaScript和css实现点击按钮后出现灰色遮罩层,并显示动态加载的字样,提高用户体验,废话不多说,上代码(写这个博客的原因是网上代码太多新手根本不知道哪里对哪里,这里剔除所有无关代码,只显示可以出现功能的最少代码)。第一:效果图为第二:实现如上效果的代码为1:遮罩层css代码#load{position:fixed;top:0px;right:0px;bottom:0…

大家好,又见面了,我是你们的朋友全栈君。

通过java、JavaScript和css实现点击按钮后出现灰色遮罩层,并显示动态加载的字样,提高用户体验,废话不多说,上代码(写这个博客的原因是网上代码太多新手根本不知道哪里对哪里,这里剔除所有无关代码,只显示可以出现功能的最少代码)。

第一:效果图为

b32d24a1c423e09b5fdda2d379ff066f.gif

第二:实现如上效果的代码为

2c31bbf0e93ae016780af1c3114fe19c.png

1:遮罩层css代码

#load{position:fixed; top: 0px; right:0px; bottom:0px;filter: alpha(opacity=60); background-color: #777;

z-index: 1002; left: 0px; display:none;

opacity:0.5; -moz-opacity:0.5;padding-top:100px;color: #000000}

2:加载中div

loading.gif加载中…

3:触发遮罩效果的按钮

4:界面初始化js,使得遮罩层效果在界面加载时被隐藏

$(document).ready(function() {

$(‘#load‘).hide();

});

5:点击加载按钮,触发遮罩层效果显示,加载数据完成在退出效果

$(‘#load‘).fadeIn();

$(‘#load‘).fadeOut();

最后附上实现该效果的loading.gif图,如有需要尽可下载使用:

689f73745fd0a54c43a5c5a1b5e4d56d.gif

原文:http://www.cnblogs.com/miaomiaokaixin/p/5408499.html

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请联系我们举报,一经查实,本站将立刻删除。

发布者:全栈程序员-站长,转载请注明出处:https://javaforall.net/129159.html原文链接:https://javaforall.net

(0)
全栈程序员-站长的头像全栈程序员-站长


相关推荐

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注

关注全栈程序员社区公众号