This plug-in provides an observer style mechanism for monitoring changes to one or more style properties with callback notification whenever any of the monitored style values change.

props
A comma delimited list of CSS style properties that are to be watched for changes. If any of the specified properties changes the function specified in the second parameter is fired.

func
The function fired in response to a changed styles. Receives this as the element changed and an object parameter that represents the watched properties and their respective values. The first parameter is passed in this structure:

{ id: watcherId, 
  props: [], 
  vals: [],
  func: thisFunc,
  fnc: internalHandler,
  origProps: origPropertyList
 };

A second parameter is the index of the changed property so data.props[i] or data.vals[i] can get the property and changed value.

interval
The interval for setInterval() for those browsers that don't support property watching in the DOM. In milliseconds.

id
An optional id that identifies this watcher. Required only if multiple watchers might be hooked up to the same element. The default is _watcher if not specified.

Example

The following code demonstrates how to keep a related element in sync with a primary element (here a shadow with a div). As the item moves, is resized or the display changes the related element applies the same operations:

el.watch("left,top,width,height,display,opacity,zIndex",
     function(w, i) {
         if (el.is(":visible")) {
             $(this).shadow(opt);
             sh.css("opacity", el.css("opacity") * opt.opacity);
         }
         else
             sh.hide();
        
     },
     100, "_shadowMove");

jQuery.fn.unwatch(id)

Unhooks watching of the element by disconnecting the event handlers.

id
Optional watcher id that was specified in the call to watch. This value can be omitted to use the default value of _watcher.