CoreThink开发(十三)增加页面加载动画
效果:

加载动画是由jquery和fakeloader这个js库实现的。
其实这个也可以做成一个插件,用数据库记录是否开启,选择动画的样式,那样扩展性会更好.
源码资源已经上传在我的csdn下载中。
http://download.csdn.net/detail/u012995856/9602642
这个独立性很好,除了引入css文件和js文件,其余的操作就是在页面加一个div层一步就OK了.
1.把资源文件放入Corethink库目录中
在Public/libs目录下新建fakeloader/js、fakeloader/css目录,把资源文件拷贝到对应的目录
2.在Home/View/Public/layout.html中引入fakeloader的js和css
<link rel="stylesheet" href="__PUBLIC__/libs/fakeloader/css/fakeloader.css">
<script src="__PUBLIC__/libs/fakeloader/js/fakeloader.min.js"></script>
<script>
$(document).ready(function(){
$(".fakeloader").fakeLoader({
timeToHide:1200,
bgColor:"#3498db",
spinner:"spinner3"
});
});
</script>
此处的layout之前已经引入了jquery库
注意js代码会依赖jquery,一定要出现在jquery的下面
3.增加显示加载动画的div
我是加在了
</body>
的前边了
<div class="fakeloader"></div>
这样就OK了.
CoreThink开发(十三)增加页面加载动画的更多相关文章
- cocos2d-x游戏开发(十五)游戏加载动画loading界面
个人原创,欢迎转载:http://blog.csdn.net/dawn_moon/article/details/11478885 这个资源加载的loading界面demo是在玩客网做逆转三国的时候随 ...
- 基于css3炫酷页面加载动画特效代码
基于CSS3实现35个动画SVG图标.这是一款基于jQuery+CSS3实现的SVG图标动画代码.效果图如下: 在线预览 源码下载 实现的代码. html代码: <div class=&qu ...
- HTML 页面加载动画效果
浏览器:Chrome, IE <!doctype html> <html> <head> <title>CSS transform: CSS only ...
- css页面加载动画
<!doctype html> <html lang="en"> <head> <meta charset="utf-8&quo ...
- webAPP制作框架Ionic--构建APP侧边栏 底部选项卡 轮播图 加载动画
超好用的移动框架--Ionic Ionic是一个轻量的手机UI库,具有速度快,界面现代化.美观等特点. 为了解决其他一些UI库在手机上运行缓慢的问题,它直接放弃了IOS6和Android4.1以下的版 ...
- 前端开发,页面加载速度性能优化,如何提高web页面加载速度
一个网页访问速度的快慢, 不仅看它服务器的配置,这里除去你空间主机配置很烂的情况以外,我们从网站开发方面来探讨,前端技术需要从哪些方面提高访问的速度,需要用到哪些技术手段. 文件的加载 图标的加载: ...
- iOS 应用中有页面加载gif动画,从后台进入前台时就消失了
解决办法: 在Appdelegate.m 里面有一个从后台进入前台所响应的方法,可以在该方法里post 一个通知,在加载动画里的页面接受通知,响应一定的方法即可 #pragma -mark 当程序进入 ...
- iOS开发——图形编程Swift篇&CAShapeLayer实现圆形图片加载动画
CAShapeLayer实现圆形图片加载动画 几个星期之前,Michael Villar在Motion试验中创建一个非常有趣的加载动画. 下面的GIF图片展示这个加载动画,它将一个圆形进度指示器和圆形 ...
- 利用css实现页面加载时旋转动画
有时浏览一些网站时在刚加载页面时候会出现一个滚动动画如下图,特别是对于一些移动端的站点或者混合应用来说应该用户体验会好很多,扒了下页面发现是用css样式控制的,于是把页面以及css样式赋值了下来, h ...
随机推荐
- log4j容器初始化探究
Log4j容器初始化探究 Log4j第一步就是初始化Logger容器Repository,这一章我们来探究Logger容器,从别从独立应用以及servlet容器下启动初始化两方面探究. 1 独立应用 ...
- jQuery 实战读书笔记之第四章:使用特性、属性和数据
使用属性 /* 每个元素都有一或多个特性,,这些特性的用途是给出相应元素或其内容的附加信息.(出自 JavaScript 高级程序设计) */ /* 特性是固有的 JavaScript 对象 属性指的 ...
- RTT工程管理
一.RTT工程管理 RTT采用SCons管理工程. 本次安装版本:Python-2.7.3.1.exe,python-2.7.11.msi,scons-2.3.1-setup.exe 安装完成后,需要 ...
- 简单而直接的Python web 框架:web.py
web.py 是一个Python 的web 框架,它简单而且功能强大.web.py 是公开的,无论用于什么用途都是没有限制的. 先让大家感受一下web.py 的简单而强大: import web ur ...
- C#实现反射调用动态加载的DLL文件中的方法
反射的作用:1. 可以使用反射动态地创建类型的实例,将类型绑定到现有对象,或从现有对象中获取类型 2. 应用程序需要在运行时从某个特定的程序集中载入一个特定的类型,以便实现某个任务时可以用到反射.3. ...
- 非阻塞IO 和阻塞IO【转】
IO模式设置网络编程常见问题总结—IO模式设置,阻塞与非阻塞的比较,recv参数对性能的影响—O_NONBLOCK(open使用).IPC_NOWAIT(msgrcv).MSG_DONTWAIT(re ...
- 最基础的PHP分类查询程序
最初级的PHP分类查询程序 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http ...
- JDBC批量操作性能提升
JDBC 当使用INSERT INTO....VALUES()语句批量插入的时候,应该使用JDBC的PreparedStatement的批量操作方法,而不是採用一条一条运行的方法. 比如(来源:htt ...
- GIT 回退出错 Unlink of file 'xx' failed. Should I try again? (y/n) 解决办法
发生过程 回退版本 如果回退版本时 里面有删除或者移动的文件 容易出这个问题 解决方法 git reset --hard 版本号 回退失败了 就 本地工作目录跟版本那个工作目录比较 然后还原修 ...
- 解决finalflares 安装成功后无法显示问题
按照网上的安装方法:http://blog.sina.com.cn/s/blog_e9370eb80101gias.html 安装插件并破解,安装过程没有任何错误,但是打开max2012始终看不到这个 ...