coding++ :局部 Loading 加载效果
$("<div id='shade' style='opacity:0.85;background:white'></div><img src='${ctx}/static/images/loading2.gif'/>").css({
position:'absolute',
top:0,
left:0,
zIndex:300,
height:'100%',
width:'100%'
}).appendTo('#id');
其中#id就是你要遮罩的div的id,其中用到的加载中图片 loading2.gif 注意这里文件格式
就是这么简单,这里需要注意的事,要进行遮罩的div的样式要这样设置position:relative(切记,否则达不到你想要的效果!)
忘了说了,这里的js代码是基于JQuery写的,要引入JQuery文件哦!
coding++ :局部 Loading 加载效果的更多相关文章
- [js开源组件开发]loading加载效果
loading加载效果 由于程序和网络的原因,常常我们需要在交互的时候,给用户一个正在加载中的动画,于是,loading组件横空出世.不需要复杂的代码,也能完成大多数业务,这就是我做组件的原则. 效果 ...
- vue2 自定义全局组件(Loading加载效果)
vue2 自定义全局组件(Loading加载效果) github地址: https://github.com/ccyinghua/custom-global-component 一.构建项目 vue ...
- 基于jquery实现页面loading加载效果
实现loading 加载提示 ······ 透明遮罩 居中效果 具体代码如下: CSS样式部分: <style type="text/css"> .background ...
- 页面加载完成前的loading加载效果
/*loading.js*/ // 加载HTML图 var _LoadingHtml = '<div id="loadingDiv" style="position ...
- 移动端最强适配(rem适配之px2rem)&& 移动端结合Vuex实现简单loading加载效果
一.rem之px2rem适配 前言:相信许多小伙伴上手移动端时面对各式各样的适配方案,挑选出一个自己觉得简便.实用.高效的适配方案是件很纠结的事情. 深有体会... 经过多个移动端项目从最初的 vie ...
- CSS动画实例:Loading加载动画效果(一)
一些网站或者APP在加载新东西的时候,往往会给出一个好看有趣的Loading图,大部分的Loading样式都可以使用CSS3制作出来,它不仅比直接使用gif图简单方便,还能节省加载时间和空间.下面介绍 ...
- CSS动画实例:Loading加载动画效果(三)
3.小圆型Loading 这类Loading动画的基本思想是:在呈现容器中定义1个或多个子层,再对每个子层进行样式定义,使得其均显示为一个实心圆形,最后编写关键帧动画控制,使得各个实心圆或者大小发生改 ...
- 2款不同样式的CSS3 Loading加载动画 附源码
原文:2款不同样式的CSS3 Loading加载动画 附源码 我们经常看到的Loading加载很多都是转圈圈的那种,今天我们来换一种有创意的CSS3 Loading加载动画,一种是声波形状的动画,另一 ...
- HTML5 五彩圆环Loading加载动画实现教程
原文:HTML5 五彩圆环Loading加载动画实现教程 今天我们要来介绍一款效果很特别的HTML5 Loading加载动画,不像其他的Loading动画,这款Loading动画颜色很丰富,并且在转圈 ...
随机推荐
- poi简介
POI简介(用于操作Excel) 1 Java Aspose Cells Java Aspose Cells 是一种纯粹的Java授权的Excel API,开发和供应商Aspose发布.这个API的最 ...
- 提权篇之简单介绍和exp利用过程
正文开始.... 提权的方法有很多种,因为一开始我入门的时候是看的小迪的网络教程,当然也推荐大家去看小迪的教程,或者直接小迪的实地培训班.这个可没什么利益关系,我认识他,他可不认识我,,但是我是在网上 ...
- AWS EC2+Docker+JMeter构建分布式负载测试基础架构
目录 概述及范围 前提条件 Part 1: Local setup-本地配置 Part 2: Cloud端基础架构--Infrastructure 总结: 原文链接 @ 概述及范围 本文介绍有关如何使 ...
- 为XHR对象所有方法和属性提供钩子 全局拦截AJAX
摘要 ✨长文 阅读约需十分钟 ✨跟着走一遍需要一小时以上 ✨约100行代码 前段时间打算写一个给手机端用的假冒控制台 可以用来看console的输出 这一块功能目前已经完成了 但是后来知道有一个腾讯团 ...
- 分布式图数据库 Nebula Graph 的 Index 实践
导读 索引是数据库系统中不可或缺的一个功能,数据库索引好比是书的目录,能加快数据库的查询速度,其实质是数据库管理系统中一个排序的数据结构.不同的数据库系统有不同的排序结构,目前常见的索引实现类型如 B ...
- linux firewalld 防火墙操作命令
查看防火墙的状态systemctl status firewalldTomcat默认使用8080端口,如果防火墙开启,需要开通8080端口firewall-cmd --zone=public --ad ...
- (转)协议森林12 天下为公 (TCP堵塞控制)
协议森林12 天下为公 (TCP堵塞控制) 作者:Vamei 出处:http://www.cnblogs.com/vamei 欢迎转载,也请保留这段声明.谢谢! 在TCP协议中,我们使用连接记录TCP ...
- Requests发送带cookies请求
一.缘 起 最近学习[悠悠课堂]的接口自动化教程,文中提到Requests发送带cookies请求的方法,笔者随之也将其用于手头实际项目中,大致如下 二.背 景 实际需求是监控平台侧下发消息有无异常, ...
- Caused by: java.lang.IllegalArgumentException
Caused by: java.lang.IllegalArgumentException 是因为jdk较高而项目需要的是低版本的问题 1.将idea或idea里的语言级别调到适合自己项目的版本比如安 ...
- 《面试经典系列》- 从底层理解==和equals的区别
前言 在我们Java面试中,基础知识基本上比定会考核的点,而“==和equals的区别”则是面试官最喜欢.最经常问的问题. 但我们看了不少的文章.解释,总是一头雾水.一知半解的,往往很容忘记.今天,我 ...