Writing /volume1/Web/Public/dokuwiki/data/log/deprecated/2024-11-14.log failed

現在位置: start » study » javascript » jquery » plugin » monitor

差分

このページの2つのバージョン間の差分を表示します。

この比較画面へのリンク

両方とも前のリビジョン前のリビジョン
次のリビジョン		前のリビジョン
study:javascript:jquery:plugin:monitor [2010/11/21 13:52] – bananastudy:javascript:jquery:plugin:monitor [2016/05/20 06:21] (現在) – [demo page] banana
行 1: 行 1:
-====== jQuery plugin for monitoring custom events ====== +====== jQuery plugin for monitoring idle state ====== 
-前に、dojoでcustom eventを監視するクラスを作成してみたが、今回は同じソースをjQuery pluginで作成してみた。\\+前に、dojoで**[[study:javascript:dojo:monitor|idle state]]**を監視するクラスを作成してみたが、今回は同じソースをjQuery pluginで作成してみた。\\
 plugin化するにあたって、optionの設定ができることと、activeステートとidleステートの際のcallbackメソッドを\\ plugin化するにあたって、optionの設定ができることと、activeステートとidleステートの際のcallbackメソッドを\\
 overrideできるようにすることを目標にした。 overrideできるようにすることを目標にした。
行 23: 行 23:
  
  return monitor;  return monitor;
- }, + }
 }); });
  
行 37: 行 36:
  defaults:{  defaults:{
  timeout : 500,  timeout : 500,
- events : [scroll], + events : [scroll]
- +
  },  },
  setDefaults: function(settings) {  setDefaults: function(settings) {
行 108: 行 106:
  $("p").css("opacity",1);  $("p").css("opacity",1);
  debug("active... after: " + args + "ms");  debug("active... after: " + args + "ms");
-}+};
 //override default onIdle method //override default onIdle method
 $.monitor.onIdle = function(){ $.monitor.onIdle = function(){
  $("p").css("opacity",0.2);  $("p").css("opacity",0.2);
  debug("idle...");  debug("idle...");
-}+};
  
-$().ready(function(){ +$(function(){ 
- $(document).monitor({timeout: 5000, events:['mousemove','keydown']});+        $(document).monitor({timeout: 5000, events:['mousemove','keydown']});
  $(window).monitor({events:['resize','scroll']});  $(window).monitor({events:['resize','scroll']});
 }); });
 </code> </code>
 基本的に 基本的に
-defalutメソッドであるonActiveメソッドとonIdleメソッドをoverrideしてから、monitorメソッドを呼び出す。+defalutメソッドであるonActiveメソッドとonIdleメソッドをoverrideしてから、monitorメソッドを呼び出す。\\
 デモページでは、documentに対してtimeout５秒を指定してある。windowのりサイズイベントとスクロールイベントに対しては デモページでは、documentに対してtimeout５秒を指定してある。windowのりサイズイベントとスクロールイベントに対しては
 defaultの１秒がたったらIdleステートになる。 defaultの１秒がたったらIdleステートになる。
  
-テストは[[http://ria-web.info/test/jQuery/demo/demo01.html|demo page]]から確認できる。 +デモは[[http://ria-web.info/test/jQuery/demo/demo01.html|demo page]]から確認できる。\\
  
 +<html>
 +<iframe width="100%" height="300" src="//jsfiddle.net/loliqoop/5Rnjm/5/embedded/" allowfullscreen="allowfullscreen" frameborder="0"></iframe>
 +</html>

トレース:

QR Code
QR Code study:javascript:jquery:plugin:monitor (generated for current page)