`
vakin.jiang
  • 浏览: 147529 次
  • 性别: Icon_minigender_1
  • 来自: 广州
社区版块
存档分类
最新评论

带遮罩层JQuery进度条提示插件

阅读更多

 

迷你音箱淘宝入口http://item.taobao.com/item.htm?id=13440256831

之前一篇博文已经发布过,现在主要做了点修改感觉可以拿的出手了,所以再发一次同步分享到javaeye论坛。

 

调用方法:

/*
* options( text )可选 提示文字内容,不提供则用缺省提示文字
 * $(document).progressDialog.showDialog(text);
 * 
 *  $.ajax({
	  .....
	  complete:function(data){
	    $(document).progressDialog.hideDialog();
	    //do something
	  }
	});

*/
$("#btn").bind('click',function(){
       $(document).progressDialog.showDialog("好事多磨,正在为您打开页面...");

      $("#demo").load("http://www.taobaobrand.com/",function(){
		$(document).progressDialog.hideDialog();
	});
   });

 

 

演示地址:在线demo

 

PS:下载附件不能运行是因为没有引入jquery库文件,由于昨天回复了一条帖子被系统判定为灌水,现在需要回答很多无聊的问题才有回复权限,所以就不一一回复大家了,在此统一说明一下。

 

 

 

分享到:
评论
18 楼 314649444 2011-03-04  
怎么设置时间呢! 3秒是固定的吗?
17 楼 wjb_4595 2011-03-04  
真不明白为什么还有人用ie6...做web开发的就不能理直气壮的告诉客户"ie6过时了.我们不支持它"吗?
16 楼 birdbiena 2011-03-04  
好东西,但是就有一点不太完美,在那个条没完就,hide()了.

希望可以改进一下
15 楼 xukjava 2011-03-03  
学习了,LZ例子非常好。针对“下载下来无法运行”的问题,大家可以看看index.html的源码,jquery-1.4.2.min.js这个文件没有放进去,自己找到放到合适的位置就可以了。
14 楼 parwin2 2011-03-03  
用了一下,兼容性不好,IE6、IE8找不到对象,用IE调试可知问题出在:“progressDialog为空或不是对象”。
13 楼 xuxin012 2011-03-03  
滚动条还没走完就停了
12 楼 harry_2013 2011-03-03  
只在线看过效果的飘过
11 楼 ripen_wang 2011-03-03  
htj1231825 写道
parwin2 写道
ileson 写道
在线的可以、下载下来就不行了?

我也遇到这个情况,下载附件无效果,楼主给个答复?

+1

好吧!你们回家洗洗睡觉吧~还是不懂Jquery的要仔细看代码啊!小兄弟们!
10 楼 htj1231825 2011-03-03  
parwin2 写道
ileson 写道
在线的可以、下载下来就不行了?

我也遇到这个情况,下载附件无效果,楼主给个答复?

+1
9 楼 parwin2 2011-03-03  
ileson 写道
在线的可以、下载下来就不行了?

我也遇到这个情况,下载附件无效果,楼主给个答复?
8 楼 xiaoLee 2011-03-03  
效果不错学习了,但在IE6里面未测试。
7 楼 ileson 2011-03-02  
$(function(){
    $("#btn").bind('click',function(){
       $(document).progressDialog.showDialog("好事多磨,正在为您打开页面...");
   $("#btn").hide();
       $("#demo").load("http://www.baidu.com/",function(){
   $(document).progressDialog.hideDialog();
   });
    });
});
6 楼 ileson 2011-03-02  
在线的可以、下载下来就不行了?
5 楼 mmtye 2011-03-02  
jQuery换成1.5之后IE9不支持,IE6不支持,难道只能在jq1.41上用么?
4 楼 yf7631497 2011-03-02  
测试 写道
yf7631497 写道
q4279134 写道
i25418515165e6不支持

+


3 楼 yf7631497 2011-03-02  
yf7631497 写道
q4279134 写道
i25418515165e6不支持

+

2 楼 yf7631497 2011-03-02  
q4279134 写道
ie6不支持

+
1 楼 q4279134 2011-03-02  
ie6不支持

相关推荐

    JQuery上传插件遮罩层插件(FineMessBox)

    JQuery上传插件FineMessBox便是为了提升这一体验而设计的,它巧妙地结合了遮罩层功能,为用户提供了一种优雅且高效的文件上传解决方案。本文将深入探讨FineMessBox的核心特点、工作原理以及实际应用,帮助开发者更好...

    jquery.blockui遮罩插件

    **jQuery BlockUI 插件详解** 在前端开发中,我们经常需要在进行异步操作(如Ajax请求)时,防止用户交互对正在进行的过程造成干扰。这时,就需要用到一种称为“遮罩”或“锁定”的功能,使得用户界面在特定时段内...

    JQuery中遮罩层progressDialog 简单使用

    本文将深入探讨如何在jQuery中使用遮罩层`progressDialog`进行简单应用,帮助开发者创建出优雅的加载提示效果,提升用户体验。 首先,我们需要了解`progressDialog`不是一个内置的jQuery方法,它通常是由第三方插件...

    jQuery带步骤流程弹出层代码.zip

    1. **弹出层的创建**:使用jQuery可以方便地创建遮罩层(modal)效果,通过CSS控制透明度和定位,使遮罩层覆盖整个页面,然后在中心位置显示操作窗口。这可以通过`.show()`和`.hide()`方法,配合CSS样式实现。 2. *...

    JQuery点击放大缩小图片并可左右滑动

    另外,可以添加一个透明的遮罩层,提供更好的视觉效果。 接下来是图片的左右滑动播放。这涉及到图片数组的管理和动画效果。可以预先加载一组图片,并将它们按照顺序排列。当用户点击“下一张”或“上一张”按钮时,...

    jquery-ui-1.11.4完整版

    4. 遮罩层(Overlay/Modal):创建半透明覆盖层,用于突出显示某个区域或阻止用户与页面其他部分交互。 5. 效果(Effects):包含各种动画效果,如淡入淡出、滑动等,可增强用户体验。 6. 位置(Position):用于...

    Jquery 图片展示效果

    2. 加载进度提示:可以使用 jQuery 动画或者进度条插件,显示图片加载进度,提升用户体验。 四、响应式图片展示 1. 媒体查询:利用 CSS3 的媒体查询,可以确保图片在不同设备和屏幕尺寸下正确显示。 2. 图片适应...

    利用Plupload.js解决大文件上传问题, 带进度条和背景遮罩层

    为了显示进度条,你可以使用jQuery UI或其他进度条插件。例如,jQuery UI的进度条可以这样设置: ```javascript var progressBar = $("#loading").progressbar({ width: '500px', color: '#B3240E', border: '1...

    数据加载-遮罩.zip

    这些插件主要用于在数据正在加载时提供一个遮罩层,以增强用户体验,让用户知道后台正在进行某种操作,并且等待期间界面不会完全无响应。 "遮罩"在网页设计中是一个常见概念,它通常是一个半透明的覆盖层,用于隐藏...

    jquery-ui-1.8.16

    Overlay组件为页面添加半透明的遮罩层,通常与Dialog或其他元素配合使用,以突出显示某个部分或阻止用户在后台进行其他操作。它可以根据需求调整透明度和尺寸,为用户提供沉浸式体验。 5. **Slider(滑块)**: ...

    HTML5精美视频播放器插件

    其次,ckin允许调整遮罩层的透明度,这是视频播放时覆盖在视频上的一个层,通常用于显示控制面板或其他信息。透明度的可调性使设计师可以创建出更符合用户体验的设计,既能保证用户操作的便利性,又不会过于干扰视频...

    layer提示层

    - **配置参数**:通过配置对象的各个属性,可以定制弹层的样式和行为,如`shade`控制遮罩层的透明度,`anim`指定动画效果。 - **事件监听**:Layer提供了一些事件接口,如`onload`、`yes`、`no`等,用于监听弹层...

    JQUER弹出遮照层

    在这个“JQUER弹出遮照层”的主题中,我们主要关注的是如何利用jQuery实现弹出对话框或者遮罩层,通常用于显示照片、多图片浏览以及弹出页面。 首先,让我们来理解“遮照层”(Overlay)的概念。遮照层是在网页主...

    jQuery在线视频弹出播放特效代码

    这里,`$('#play-video').click`事件用于当用户点击播放按钮时显示视频弹窗,`$('#video-popup, .overlay').click`则监听弹窗或遮罩层的点击事件,以关闭视频。 4. **视频控制**:如果需要更丰富的视频控制,如暂停...

    jQuery EasyUI-其他

    4. **窗帘(Curtain)**: 这个组件常用于加载提示,当页面内容正在加载时显示一个遮罩层,提高用户交互体验。 5. **表格(Grid)**: EasyUI的表格组件支持数据分页、排序、过滤、编辑等功能,可以与后台数据库无缝...

    PHPCMS V9 修改flash上传为H5上传方案 phpcms上传文件statics下js

    7. **jquery.tools.min.js**:jQuery Tools集成了多个实用工具,如遮罩层、浮动提示和日期选择器,可能在H5上传过程中提供辅助功能。 8. **excanvas.min.js**:这是一个用于IE浏览器的Canvas polyfill,使不支持...

Global site tag (gtag.js) - Google Analytics