`
rjhym
  • 浏览: 64601 次
  • 性别: Icon_minigender_1
  • 来自: 北京
社区版块
存档分类
最新评论

jquery制作右下角定时消息框

 
阅读更多

经常看到网页右下角有消息框弹出。自己使用jquery只做一个。<wbr></wbr>

准备:下载jquery-1.5.1.js,jquery.messager.js,jquery.timers.js文件。

编写html文件:

<div id="jquerydiv"></div>
<script type="text/javascript"src="jquery-1.3.min.js"></script>
<script type="text/javascript"src="jquery.messager.js"></script>
<script type="text/javascript"src="jquery.timers.js"></script>
<script>
$(document).everyTime('5s',function(){

$.messager.show(0,'送你一个Jquery Messager消息弹出插件!',2000);

});
</script>

执行即可!

插件介绍:

jQuery Timers插件 提供定时执行的功能,使用非常简单。
提供了三个函式  1. everyTime(时间间隔, [计时器名称], 函式名称, [次数限制], [等待函式程序完成])  2. oneTime(时间间隔, [计时器名称], 呼叫的函式)  3. stopTime ([计时器名称], [函式名称])
/*************************************************************   *   everyTime(时间间隔, [计时器名称], 函式名称, [次数限制], [等待函式程序完成])   *************************************************************/    //每1秒执行函式test()  function test(){     //do something...  }  $('body').everyTime('1s',test);     //每1秒执行  $('body').everyTime('1s',function(){   //do something...  });     //每1秒执行,并命名计时器名称为A  $('body').everyTime('1s','A',function(){   //do something...  });     //每20秒执行,最多5次,并命名计时器名称为B  $('body').everyTime('2das','B',function(){   //do something...  },5);     //每20秒执行,无限次,并命名计时器名称为C  //若时间间隔抵到,但函式程序仍未完成则需等待执行函式完成后再继续计时  $('body').everyTime('2das','C',function(){      //执行一个会超过20秒以上的程式  },0,true);     /***********************************************************   *   oneTime(时间间隔, [计时器名称], 呼叫的函式)   ***********************************************************/  //倒数10秒后执行  $('body').oneTime('1das',function(){   //do something...  });     //倒数100秒后执行,并命名计时器名称为D  $('body').oneTime('1hs','D',function(){   //do something...  });     /************************************************************   *  stopTime ([计时器名称], [函式名称])   ************************************************************/  //停止所有的在$('body')上计时器  $('body').stopTime ();     //停止$('body')上名称为A的计时器  $('body').stopTime ('A');     //停止$('body')上所有呼叫test()的计时器  $('body').stopTime (test);    自定义时间单位  打开源代码  找到  powers: {     // Yeah this is major overkill...     'ms': 1,     'cs': 10,     'ds': 100,     's': 1000,     'das': 10000,     'hs': 100000,     'ks': 1000000    }  可以定制自己想要的单位。
jquery messager 使用。
<script type="text/javascript">
$(document).ready(function(){
 $.messager.show(0,'送你一个Jquery Messager消息弹出插件!');
 $("#showMessager300x200").click(function(){
 $.messager.lays(300, 200);
 $.messager.show(0, '300x200的消息',60000);
 });
 $("#showMessagerFadeIn").click(function(){
 $.messager.anim('fade', 2000);
 $.messager.show(0, 'fadeIn动画消息');
 });
 $("#showMessagerShow").click(function(){
 $.messager.anim('show', 1000);
 $.messager.show(0, 'show动画消息');
 });
 $("#showMessagerDim").click(function(){
 $.messager.show('<font color=red>自定义标题</font>', '<font color=green style="font-size:14px;font-weight:bold;">自定义内容</font>');
 });
 $("#showMessagerSec").click(function(){
 $.messager.show(0, '一秒钟关闭消息', 1000);
 });
});
</script>
分享到:
评论

相关推荐

Global site tag (gtag.js) - Google Analytics