Jquery Live Function

Posted by marharépa on Stack Overflow See other posts from Stack Overflow or by marharépa
Published on 2010-05-28T11:53:45Z Indexed on 2010/05/28 12:01 UTC
Read the original article Hit count: 363

Filed under:
|
|
|

Hi! I want to make this script to work as LIVE() function. Please help me!

 $(".img img").each(function() {
    $(this).cjObjectScaler({
   destElem: $(this).parent(),
      method: "fit"
    });
 });

the cjObjectScaler script (called in the html header) is this: (thanks for Doug Jones)

(function ($) {
 jQuery.fn.imagesLoaded = function (callback) {
  var elems = this.filter('img'),
   len = elems.length;
  elems.bind('load', function () {
   if (--len <= 0) {
    callback.call(elems, this);
   }
  }).each(function () {
   // cached images don't fire load sometimes, so we reset src.
   if (this.complete || this.complete === undefined) {
    var src = this.src;
    // webkit hack from http://groups.google.com/group/jquery-dev/browse_thread/thread/eee6ab7b2da50e1f
    this.src = '#';
    this.src = src;
   }
  });
 };
})(jQuery);

/*
 CJ Object Scaler
*/
(function ($) {
 jQuery.fn.cjObjectScaler = function (options) {

  /* 
   user variables (settings)
  ***************************************/
  var settings = {
   // must be a jQuery object
   method: "fill",
   // the parent object to scale our object into
   destElem: null,
   // fit|fill
   fade: 0 // if positive value, do hide/fadeIn
  };

  /* 
   system variables
  ***************************************/
  var sys = {
   // function parameters
   version: '2.1.1',
   elem: null
  };

  /* 
   scale the image
  ***************************************/

  function scaleObj(obj) {

   // declare some local variables
   var destW = jQuery(settings.destElem).width(),
    destH = jQuery(settings.destElem).height(),
    ratioX, ratioY, scale, newWidth, newHeight, 
    borderW = parseInt(jQuery(obj).css("borderLeftWidth"), 10) + parseInt(jQuery(obj).css("borderRightWidth"), 10),
    borderH = parseInt(jQuery(obj).css("borderTopWidth"), 10) + parseInt(jQuery(obj).css("borderBottomWidth"), 10),
    objW = jQuery(obj).width(),
    objH = jQuery(obj).height();

   // check for valid border values. IE takes in account border size when calculating width/height so just set to 0
   borderW = isNaN(borderW) ? 0 : borderW;
   borderH = isNaN(borderH) ? 0 : borderH;

   // calculate scale ratios
   ratioX = destW / jQuery(obj).width();
   ratioY = destH / jQuery(obj).height();

   // Determine which algorithm to use
   if (!jQuery(obj).hasClass("cf_image_scaler_fill") && (jQuery(obj).hasClass("cf_image_scaler_fit") || settings.method === "fit")) {
    scale = ratioX < ratioY ? ratioX : ratioY;
   } else if (!jQuery(obj).hasClass("cf_image_scaler_fit") && (jQuery(obj).hasClass("cf_image_scaler_fill") || settings.method === "fill")) {
    scale = ratioX < ratioY ? ratioX : ratioY;
   }

   // calculate our new image dimensions
   newWidth = parseInt(jQuery(obj).width() * scale, 10) - borderW;
   newHeight = parseInt(jQuery(obj).height() * scale, 10) - borderH;

   // Set new dimensions & offset
   jQuery(obj).css({
    "width": newWidth + "px",
    "height": newHeight + "px"//,
   // "position": "absolute",
//    "top": (parseInt((destH - newHeight) / 2, 10) - parseInt(borderH / 2, 10)) + "px",
//    "left": (parseInt((destW - newWidth) / 2, 10) - parseInt(borderW / 2, 10)) + "px"
   }).attr({
    "width": newWidth,
    "height": newHeight
   });

   // do our fancy fade in, if user supplied a fade amount
   if (settings.fade > 0) {
    jQuery(obj).fadeIn(settings.fade);
   }

  }

  /* 
   set up any user passed variables
  ***************************************/
  if (options) {
   jQuery.extend(settings, options);
  }

  /* 
   main
  ***************************************/
  return this.each(function () {

   sys.elem = this;

   // if they don't provide a destObject, use parent
   if (settings.destElem === null) {

    settings.destElem = jQuery(sys.elem).parent();
   }

   // need to make sure the user set the parent's position. Things go bonker's if not set.
   // valid values: absolute|relative|fixed
   if (jQuery(settings.destElem).css("position") === "static") {
    jQuery(settings.destElem).css({
     "position": "relative"
    });
   }

   // if our object to scale is an image, we need to make sure it's loaded before we continue.
   if (typeof sys.elem === "object" && typeof settings.destElem === "object" && typeof settings.method === "string") {

    // if the user supplied a fade amount, hide our image
    if (settings.fade > 0) {
     jQuery(sys.elem).hide();
    }

    if (sys.elem.nodeName === "IMG") {

     // to fix the weird width/height caching issue we set the image dimensions to be auto;
     jQuery(sys.elem).width("auto");
     jQuery(sys.elem).height("auto");

     // wait until the image is loaded before scaling
     jQuery(sys.elem).imagesLoaded(function () {
      scaleObj(this);
     });

    } else {

     scaleObj(jQuery(sys.elem));
    }

   } else {

    console.debug("CJ Object Scaler could not initialize.");
    return;

   }

  });

 };
})(jQuery);

© Stack Overflow or respective owner

Related posts about jQuery

Related posts about html