文档章节

很多人想要的Jquery 加载Loading效果,可以加到自己的项目中,结合Ajax使用

深圳大道
 深圳大道
发布于 2016/12/29 15:40
字数 211
阅读 2
收藏 0
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>loading效果</title>
    <script language="javascript" type="text/javascript" src="/Scripts/jquery-1.4.4.min.js"></script>
    <script type="text/javascript">
        function showLoad(tipInfo) {
            var eTip = document.createElement('div');
            eTip.setAttribute('id', 'tipDiv');
            eTip.style.position = 'absolute';
            eTip.style.display = 'none';
            eTip.style.border = 'solid 0px #D1D1D1';
            eTip.style.backgroundColor = '#4B981D';
            eTip.style.padding = '5px 15px';
            eTip.style.top = '10px';
            eTip.style.right = '10px';
            eTip.style.width = '120px';

            eTip.innerHTML = '<img src=\'/Images/loader.gif\' style=\'float:left;\' />&nbsp;&nbsp;<span style=\'color:#ffffff; font-size:12px\'>' + tipInfo + '</span>';
            try {
                document.body.appendChild(eTip);
            } catch (e) { }
            $("#tipDiv").css("float", "right");
            $("#tipDiv").css("z-index", "99");
            $('#tipDiv').fadeIn();
        }

        function closeLoad() {
            $('#tipDiv').fadeOut();
        }
    </script>
</head>
<body>
<input type="button" value="查看效果" onclick="showLoad('正在运行中...');" />
<input type="button" value="关闭效果" onclick="closeLoad();" />
</body>
</html>
<asp:Button ID="Button1" runat="server" Text="查询施工价格" OnClientClick="showLoad('正在查询中...');" OnClick="Button1_Click" />

protected void Button1_Click(object sender, EventArgs e)
{
	//处理完成后
	ScriptManager.RegisterClientScriptBlock(Page, this.GetType(), "close", "closeLoad();", true); 
}


本文转载自:http://blog.csdn.net/smartsmile2012/article/details/7971763

共有 人打赏支持
深圳大道
粉丝 3
博文 877
码字总数 0
作品 0
深圳
架构师
私信 提问
50 个优秀 CSS3 技巧和优美的设计教程

Filter Functionality with CSS3 Thumbnail Proximity Effect with jQuery and CSS3 Fullscreen Background Image Slideshow with CSS3 CSS3 灯箱 Slopy Elements with CSS3 Item Blur Effec......

红薯
2012/01/11
2.5K
0
10 个新鲜的 Ajax 相关的 jQuery 插件

好久没来 jQuery 插件了,是不是怪想念的呢?哈哈,再来几个: 1. jquery.terminal 该插件实现了在浏览器上的终端交互操作效果,你完全可自定义交互的命令,演示地址请看:here. 2. jQuery P...

红薯
2011/09/14
4.3K
11
Ajax等待返回结果时,弹出一个友好的等待提示

巧用Ajax的beforeSend 提高用户体验   jQuery是经常使用的一个开源js框架,其中的$.ajax请求中有一个beforeSend方法,用于在向服务器发送请求前执行一些动作。 具体可参考jQuery官方文档:...

mCod
2018/08/22
0
0
6款新颖的jQuery和CSS3进度条插件

现在的网页功能越来越多,尤其是AJAX的广泛应用,进度条和Loading加载动画显得越来越重要了。下面给大家介绍几款比较新颖的jQuery和CSS3进度条Loading加载动画插件,希望对大家有帮助。 1、不...

ruby_chen
2013/03/05
46
0
使用 Grails 与 jQuery 创建 Web Calendar

Grails 是一套用于快速 Web 应用开发的开源框架,它基于 Groovy 编程语言,并构建于 Spring、Hibernate 和其它标准 Java 框架之上,从而为大家带来一套能实现超高生产力的一站式框架。 jQue...

红薯
2010/06/25
1K
1

没有更多内容

加载失败,请刷新页面

加载更多

前端、后端和全栈到底不该学什么

1、前言 在职业规划咨询过程中经常会被问到这样的问题: 老师,我是该深入钻研专精一门,走技术大牛路线,还是所有都要精通,做一个全栈工程师? 类似问题的变种还有,老师我是不是该30岁最迟...

前端攻城小牛
30分钟前
3
0
【git命令】git-stash

应用场景 应用场景:使用git的时候,我们往往使用branch解决任务切换问题,例如,我们往往会建一个自己的分支去修改和调试代码, 如果别人或者自己发现原有的分支上有个不得不修改的bug,我们...

echojson
31分钟前
2
0
centos7.3编译安装OpenSSL1.1.1b

简介 OpenSSL是一个开放源代码的软件库包,应用程序可以使用这个包来进行安全通信,避免窃听,同时确认另一端连接者的身份。这个包广泛被应用在互联网的网页服务器上。 安装 下载:下载地址 ...

阿dai学长
33分钟前
1
0
0基础【转行】大数据

目前大数据行业异常火爆,不少人都对大数据充满了兴趣,其中有大部分人都是之前没有接触过计算机技术的,对编程语言也不太了解,那是不是这部分零基础的朋友就学不了大数据了呢?答案当然是否...

董黎明
34分钟前
1
0
Krpano 动态传参-action

效果解释:点击热点1,触发显示或隐藏热线2。 hotspot等标签允许编写自定义属性,这里直接设置自定义属性为dk=spot6,点击spot7,显示或隐藏spot6。 action方法体中,直接引用get(dk)即可获得...

华山猛男
40分钟前
1
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部