`

CSS 页面置灰等待效果

    博客分类:
  • CSS
 
阅读更多
<div id='tms-comm-load' style="display:none">
 <div class='tms-load-box'>
    <img src='<%=request.getContextPath()%>/static/images/load.gif' />
    <span id="tms-load-msg"></span>
 </div>
 <div class='tms-load-mask'></div>
</div>


.tms-load-box{
	display:inline-block;
	border: 2px solid #A1C5F7;
	padding: 13px 20px;
	background:#fff;
	position:fixed;
	z-index:999999;
	color:#444;
	left:50%;
	top:50%;
	margin-left:-90px;
	margin-top:-30px;
}
.tms-load-box img{
	margin-right:10px;
}
.tms-load-mask{
	height:100%;
	width:100%;
	position:fixed;
	z-index:99999;
	left:0;
	top:0;
	background: #545454;
	opacity: 0.50;
	filter: alpha(opacity=50);
}


showLoading:function(msg){
		 var defaultMsg = "正在处理,请稍后...";
		 if(msg) defaultMsg = msg;
		 $("#tms-load-msg").html(defaultMsg);
		 $("#tms-comm-load").show();
	 },
	 hideLoading:function(){
		 $("#tms-comm-load").hide();
	 },



分享到:
评论
发表评论

文章已被作者锁定,不允许评论。

相关推荐

    网页全部置灰[css]

    网页全部置灰[css]

    30种css3 animation页面加载等待动画特效

    本文将深入探讨标题"30种css3 animation页面加载等待动画特效"所涵盖的知识点,并解释如何利用CSS3动画实现各种页面加载等待效果。 首先,我们需要理解CSS3中的`@keyframes`规则,这是创建动画的基础。`@keyframes`...

    CSS等待遮罩loading效果(多个)

    为了提高用户的等待体验,设计师们会采用CSS来创建各种各样的“等待遮罩”或“loading”效果。"CSS等待遮罩loading效果(多个)"是一个集合,包含了多个不同的CSS实现的加载动画,旨在为用户提供美观且不单调的加载...

    js+css时钟效果 js+css时钟效果

    js+css时钟效果js+css时钟效果js+css时钟效果js+css时钟效果js+css时钟效果js+css时钟效果js+css时钟效果js+css时钟效果js+css时钟效果js+css时钟效果js+css时钟效果js+css时钟效果js+css时钟效果js+css时钟效果js+...

    页面效果 CSS CSS

    本资源包专注于“页面效果”,特别是通过CSS实现的视觉增强功能,这为设计师提供了丰富的工具和技巧来提升用户体验。 首先,我们来详细探讨CSS中的页面效果。CSS不仅限于字体、颜色和布局的基本控制,它还能创建...

    页面加载等待效果

    页面等待效果的实现方式多种多样,可以从简单的HTML/CSS实现到更复杂的JavaScript动画。以下是一些关键的技术点: 1. **CSS动画**:使用CSS3的`@keyframes`规则可以创建动画效果。通过定义动画的开始和结束状态,...

    Javascript打开页面等待效果

    综上所述,实现JavaScript打开页面等待效果是一个涉及CSS、JavaScript和用户体验设计的过程。开发者可以根据项目需求选择合适的技术方案,为用户提供更流畅、更具吸引力的页面加载体验。在实际开发中,不断优化和...

    js等待提示,页面提交等待载入效果

    总之,"js等待提示"是通过JavaScript和CSS实现的一种提升用户体验的策略,它确保用户在页面进行后台处理时能够明确感知到系统的活动状态,从而提高用户满意度。根据项目需求,你可以选择简单的文本提示,也可以创建...

    jquery网页变灰

    2. **创建CSS样式**:定义一个CSS类,用于改变页面的灰色效果。例如: ```css .grey-out { opacity: 0.5; /* 阴影效果,值范围0到1,0表示完全透明,1表示完全不透明 */ filter: grayscale(100%); /* IE及旧版...

    html计数器功能实现包括css页面

    html计数器功能实现包括css页面html计数器功能实现包括css页面html计数器功能实现包括css页面html计数器功能实现包括css页面html计数器功能实现包括css页面html计数器功能实现包括css页面html计数器功能实现包括css...

    用纯CSS实现页面的扇形展开效果

    内容概要: 使用纯css实现扇形展开效果 能学到什么: css变化, 旋转以及定义旋转的原点 阅读建议: 有一点点css基础的

    30款css3页面加载等待动画特效.zip

    本资源"30款css3页面加载等待动画特效.zip"正是针对这一需求,提供了30种不同风格和设计的CSS3页面加载等待动画,旨在提升用户在页面加载过程中的体验。 1. **CSS3动画基础**:CSS3引入了关键帧动画(@keyframes)...

    jQuery+CSS3页面内容加载效果

    "jQuery+CSS3页面内容加载效果"是一个结合了这两种强大技术的实例,旨在提升网站的交互性和视觉吸引力。jQuery是一种轻量级的JavaScript库,它简化了DOM操作、事件处理、动画效果以及Ajax交互。而CSS3则是最新的CSS...

    CSS3实现的酷炫流光页面动画特效源码

    CSS3作为现代网页设计的核心技术之一,提供了丰富的样式和动画效果,使得开发者可以创建出各种酷炫的页面元素。本主题我们将深入探讨如何利用CSS3实现酷炫的流光页面动画特效。 首先,CSS3中的关键帧动画(@...

    前端领域,运用CSS3实现页面动态效果

    动画和过渡:CSS3 提供了两种新的动画和过渡效果,即 @keyframes 和 transition。这些效果可以创建各种动画效果,并实现更平滑的过渡效果。 弹性盒子布局(Flexbox):Flexbox 是一种新的布局模型,可以帮助开发者更...

    css图片外边框效果实现

    css图片外边框效果实现 css图片外边框效果实现

    html+css登录页面

    "html登录"标签强调了仅使用HTML实现的基本登录界面,而"html+css登录"则更注重于利用CSS提升页面的视觉效果和交互性。在实际开发中,通常还会结合JavaScript进行表单验证和提交处理,确保用户输入的有效性,并实现...

    CSS3实现酷炫流光页面动画特效.zip

    在网页设计领域,CSS3(层叠样式表第三版)的出现为开发者提供了更多创造性的可能性,特别是对于页面动画和视觉效果的实现。本资源"CSS3实现酷炫流光页面动画特效.zip"就是一个很好的例子,它展示了如何利用CSS3的...

    网上商店的CSS页面布局

    本主题将深入探讨如何利用CSS实现导航的交替变换效果以及如何在页面中插入带有透明背景的Flash文件,从而提升网站的互动性和吸引力。 一、CSS网页布局基础 CSS网页布局通常包括流式布局、网格布局、响应式布局等...

    html5+css3 animation制作各种页面过渡切换动画效果

    在制作页面过渡切换效果时,我们通常会使用CSS3的`transition`属性作为辅助,它处理元素从一种样式到另一种样式的平滑过渡。当结合`@keyframes`规则,我们可以创建自定义动画。`@keyframes`允许开发者定义动画在不同...

Global site tag (gtag.js) - Google Analytics