网页特效

jquery弹出UI提示 弹出div,弹出加载进度提示,弹出确认删除提示等信息

位置:首页 > 网页特效 > 窗口特效,2013-09-28
一个jquery插件,是jquery弹出UI提示弹出div,弹出加载进度提示,弹出确认删除提示等信息,效果漂亮实用方法说明alert警告提示ui.alert('

jquery弹出UI提示,jquery弹出div

一个jquery插件,是jquery弹出UI提示 弹出div,弹出加载进度提示,弹出确认删除提示等信息,效果漂亮实用

方法 说明
alert 警告提示 ui.alert('提示内容',时间,是否有遮蔽层)
error 错误提示 ui.error('提示内容',时间,是否有遮蔽层)
success 成功提示 ui.success('提示内容',时间,是否有遮蔽层)
notice 注意提示 ui.notice('提示内容',时间,是否有遮蔽层)
confirm 确认提示 ui.confirm('提示内容',function(){},是否有遮蔽层)
prompt 输入提示 ui.prompt('提示内容',function(){},是否有遮蔽层)
box 弹出窗口 ui.box('标题',内容 | url | 元素对象,POST发送请求信息,是否有遮蔽层,请求回调函数,[宽度,高度])
move ui.move(事件作用元素的id 或者 对象,需要移动元素的id 或者 对象,absolute | fixed )

• ui.alert | ui.error | ui.success | ui.notice 方法

<script type="text/javascript"> /*
 ui.alert(s,t,c),ui.error(s,t,c),ui.success(s,t,c),ui.notice(s,t,c)
 @s:提示信息; 
 @t:显示时间;默认 2000 毫秒
 @c:是否有遮蔽层 默认true  
*/ ui.alert('用户名不能空!'); //提示信息显示5秒 有遮蔽层 ui.alert('用户名不能空!',5000); //提示信息显示3秒 无遮蔽层 ui.alert('用户名不能空!',3000,false); </script>

• ui.confirm 方法

<script type="text/javascript"> /*
 ui.confirm(s,f,c)
 @s:提示信息; 
 @f:回调函数
 @c:是否有遮蔽层 默认true  
*/ ui.confirm('你确认要删除吗?',function(z){         if(z){                 ui.success('删除成功!');    
        }else{                 ui.alert('没有删除!');      
        } }); </script>

• ui.prompt 方法

<script type="text/javascript"> /*
 ui.prompt(s,f,c)
 @s:提示信息; 
 @f:回调函数
 @c:是否有遮蔽层 默认true  
*/ ui.prompt('请输入你的名字',function(z){         if(z){                 ui.alert('你输入的信息是:'+z);         }else{                 ui.alert('你没有输入信息!');   
        } }); //当取消时 z===false </script>

• ui.box 方法

<div id="mm">         <p>内容内容内容内容内容</p><p>内容</p><p>内容</p><p>内容</p><p>内容</p><p>内容</p> </div> <script type="text/javascript"> /*
 ui.box(title,obj,data,c,f,wh);
 @title:窗口标题; 
 @obj:窗口html内容 或者 url 或者 元素对象
 @data:当obj为url时post提交的内容 默认为false;
 @c:是否有遮蔽层 默认false
 @f:回调函数 当obj为url时 请求返回的数据 执行这个函数,默认为false 表示直接显示 ;这个函数包含2个参数 function(a,b){
                @a 为返回的数据;
                @b 为窗口对象;
                把数据显示在窗口可:b.innerHTML=a;
        }
@wh:数组 [宽度,高度] 单位px 默认 [false,false] 表示自动
*/ //登陆窗口 向a.php发送请求获取模版,POST请求参数type=denglu,重新初始化 F.st() 以便自动验证表单 ui.box('易寻登录','a.php','type=denglu',true,function(a,b){         b.innerHTML=a;         F.st();// 这里动态创建了表单 重新初始化 F.st() 以便自动验证表单 }); // 当 @obj 为元素对象  ui.box('易寻测试',A.$('mm'));  
 // 当 @obj 为内容  B=ui.box('易寻测试22','<p>一个全新理念的社交网站——易寻,<br>以全新的理念构建全新的互联网信息秩序<br>为用户提供一个高效、平等、精准、丰富的信息分享平台<br>内容内容内容<br></p><p><a href="javascript:;" onClick="this.parentNode.parentNode.parentNode.children[2].onclick();">关闭窗口</a> <input type="button"  value="点这里也关闭" onclick="B.close();"></p>');  </script>

• ui.move 方法

<div id="mm">         <h1 id="aad">易寻是什么?</h1>     <p>网络让我们不出门便知天下,<br> 易寻让我们轻轻松松就找到志同道合的朋友,<br> 一个全新理念的社交网站——易寻。</p> </div> <script type="text/javascript"> /*
 ui.move(ob,yb,fd);
 @ob:触发移动的元素 或者 id; 
 @yb:移动的元素 或者 id;默认为 @ob 的父级
 @fd:表示 absolute | fixed ;默认为 absolute
*/ //移动易寻 当鼠标在H1标签上按下才有效 ui.move('aad'); // 或者 ui.move(A.$('aad'));  或者 ui.move(A.$('aad'),'mm'); //移动易寻 整个div均有效 ui.move('mm','mm'); //移动易寻 整个div均有效 不随滚动条滚动 ui.move('mm','mm','fixed'); </script>


TAGS:jquery弹出UI提示jquery弹出div

猜你喜欢

NewHot