jQuery+oLoader加载图片和页面效果

jQuery+oLoader加载图片和页面效果

添加时间:2021-01-17 11:50:23
站长推荐丨赞助论坛,可获取海量资源终身免费下载权限奥!
举报 举报
收藏
预览
附件 附件
  • 模板类型模板类型:jQuery插件
  • 模板颜色模板颜色:中级
  • 下载积分下载积分:28 米粒
  • 下载权限下载权限:

    赞助会员

我们经常会遇到加载图片和页面的效果,今天我们就介绍oLoader和oPageLoader这两个方法。
jQuery+oLoader加载图片和页面效果
分类:其它特效 > jQuery插件 难易:中级

演示一:加载图片

$(function(){ 
  $('img.img').oLoader({ 
    waitLoad: true, 
    fadeLevel: 0.9, 
    backgroundColor: '#fff', 
    style:0, 
    image: 'loader.gif' 
  }); 
});

演示二:加载页面

$('#ajax').oLoader({ 
  url: 'ajax.html', 
  updateOnComplete: false 
});

演示三:回调函数

{ 
  image: 'images/loader.gif',  //加载动画图片 
  style: 1, //loader样式 
  modal: true, //模态遮罩,如果为false,则不会显示遮罩层 
  fadeInTime: 300, //遮罩层淡入速度,毫秒 
  fadeOutTime: 300, //遮罩层谈出速度,毫秒 
  fadeLevel: 0.7, //遮罩层透明度,0-1 
  backgroundColor: '#000', //背景色 
  imageBgColor: '#fff', //loader动画图片背景 
  imagePadding: '10', 
  showOnInit: true, //初始化显示加载动画 
  hideAfter: 0, //time in ms 
  url: false, //Ajax调用参数,下同 
  type: 'GET', 
  data: false, 
  updateContent: true, //是否替换ajax返回内容 
  updateOnComplete: true,//是否立即替换服务器返回的内容 
  showLoader: true, //是否显示loader图片 
  effect: '', //动态效果,支持door,slide,doornslide 
  wholeWindow: false, //when true, oLoader covers the whole window 
  lockOverflow: false, //locks body's overflow while loading 
  waitLoad: false, //当元素内容加载完才显示内容 
  checkIntervalTime: 100, //interval which checks for position changes 
    
  //回调函数 
  complete: '', //当动画结束,内容加载完调用 
  onStart: '', //动画开始时调用 
  onError: '' //当ajax请求出错时调用 
}

oPageLoader示例:

oPageLoader可以实现漂亮的加载页面时的进度条动画,默认调用代码如下:

$(function(){ 
  $.oPageLoader(); 
});

回调函数update

$.oPageLoader({ 
  update: function(data) { 
    //with data.percentage //百分比
    //     data.loaded  //已加载的元素
    //     data.total           //加载的元素总数
  } 
});
相关内容推荐
资源求助发帖
查看更多发帖

*

回帖描述:

*

链接类型:

*

下载链接:

密码:
发帖规则:回帖内容为会员之间的私信,普通网友无法查看。
免责声明:回帖中提供的链接内容仅供会员之间学习参考使用,获取内容后请在法律法规范围内使用。回帖提供的内容应符合法律法规要求,不得违反法律法律的要求。
站点权责:回帖内容如违反法律法规,站点有权封停账号使用权利。对用户举报的内容,站点有责任及时删除违规内容。
热点内容推荐
标题:jQuery+oLoader加载图片和页面效果

*

描述:
平均回复时间:3-10分钟
规则介绍:悬赏寻求论坛网友分享资源,站点对分享内容的准确性,合法性,版权等没有足够的监管能力。如果您发现资源不正确,无法使用,不符合法律法律等情况,您可以直接举报资源。站长将尽快核实您的举报,并根据情况,采取封号,退换米粒等处理。

*

回帖描述:

*

链接类型:

*

阅读权限:

*

下载链接:

密码:
发帖规则:回帖内容为会员之间的私信,普通网友无法查看。
免责声明:回帖中提供的链接内容仅供会员之间学习参考使用,获取内容后请在法律法规范围内使用。回帖提供的内容应符合法律法规要求,不得违反法律法律的要求。
站点权责:回帖内容如违反法律法规,站点有权封停账号使用权利。对用户举报的内容,站点有责任及时删除违规内容。
  • 背景波浪
  • 背景波浪
  • 波浪
  • 波浪
客服
在线咨询
周一 至 周日 9:00 ~ 22:00
QQ:1326974360
微信:juyoubuluo6688
客服热线
18205485173
工作日 9:00 ~ 18:00
微信扫码咨询
客户服务
欢迎咨询服务
咨询量较多时,请耐心等待
社群

关注公众号

获取更多资讯

扫码进群(QQ)

与更多大牛交流沟通

0.161893s