[Resolvido] Listar e identificar DIVs

Voce pode colocar id diferentes. E chamar no jquery via ID depois de uma condição dizendo qual delas irá ser configurada.

Sim sim, porem elas sao geradas pelo jquerycrop. E nao estou conseguindo no codigo identificar para atribuir um ID e diferenciar, entende.

sim. Deixa eu entender realmente, as divs são criadas automaticamente pelo jquerycrop, ok e voce não consegue ver esse código? porque ae voce poderia colocar uma variavel js para identificar. Se o problema for identificar mesmo colocando uma variavel. Só vendo o código para tentar ver uma solução e te ajudar. Se puder colocar esse código do jquerycrop criando a div seria bom.

segue:

/**
* jquery.Jcrop.js v0.9.8
* jQuery Image Cropping Plugin
* @author Kelly Hallman <khallman@gmail.com>
* Copyright (c) 2008-2009 Kelly Hallman - released under MIT License {{{
*
* Permission is hereby granted, free of charge, to any person
* obtaining a copy of this software and associated documentation
* files (the "Software"), to deal in the Software without
* restriction, including without limitation the rights to use,
* copy, modify, merge, publish, distribute, sublicense, and/or sell
* copies of the Software, and to permit persons to whom the
* Software is furnished to do so, subject to the following
* conditions:

* The above copyright notice and this permission notice shall be
* included in all copies or substantial portions of the Software.

* THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
* EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES
* OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND
* NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT
* HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY,
* WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING
* FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR
* OTHER DEALINGS IN THE SOFTWARE.

* }}}
*/

(function($) {

$.Jcrop = function(obj,opt)

// Sanitize some options {{{

var obj = obj, opt = opt;

if (typeof(obj) !== 'object') obj = $(obj)[0];
if (typeof(opt) !== 'object') opt = { };

// Some on-the-fly fixes for MSIE...sigh
if (!('trackDocument' in opt))
{

	opt.trackDocument = $.browser.msie ? false : true;
	if ($.browser.msie && $.browser.version.split('.')[0] == '8')
 opt.trackDocument = true;
}

if (!('keySupport' in opt))
opt.keySupport = $.browser.msie ? false : true;

// }}}
// Extend the default options {{{

var defaults = {

	// Basic Settings
	trackDocument: true,
	baseClass: 'jcrop',
	addClass: null,

	// Styling Options
	bgColor: 'black',
	bgOpacity: .6,
	borderOpacity: .4,
	handleOpacity: .5,

	handlePad: 5,
	handleSize: 9,
	handleOffset: 5,
	edgeMargin: 14,

	aspectRatio: 0,
	keySupport: true,
	cornerHandles: true,
	sideHandles: true,
	drawBorders: true,
	dragEdges: true,

	boxWidth: 0,
	boxHeight: 0,

	boundary: 8,
	animationDelay: 20,
	swingSpeed: 3,

	allowSelect: true,
	allowMove: true,
	allowResize: true,

	minSelect: [ 0, 0 ],
	maxSize: [ 0, 0 ],
	minSize: [ 0, 0 ],

	// Callbacks / Event Handlers
	onChange: function() { },
	onSelect: function() { }

};
var options = defaults;
setOptions(opt);

// }}}
// Initialize some jQuery objects {{{

var $origimg = $(obj);
var $img = $origimg.clone().removeAttr('id').css({ position: 'absolute' });

$img.width($origimg.width());
$img.height($origimg.height());
$origimg.after($img).hide();

presize($img,options.boxWidth,options.boxHeight);

var boundx = $img.width(),
	boundy = $img.height(),

	$div = $('<div />')
 .width(boundx).height(boundy)
 .addClass(cssClass('holder'))
 .css({
 position: 'relative',
 backgroundColor: options.bgColor
 }).insertAfter($origimg).append($img);
;

if (options.addClass) $div.addClass(options.addClass);
//$img.wrap($div);

var $img2 = $('<img />')/*{{{*/
 .attr('src',$img.attr('src'))
 .css('position','absolute')
 .width(boundx).height(boundy)

var $img_holder = $('<div />')/*{{{*/
	.width(pct(100)).height(pct(100))
	.css({
 zIndex: 310,
 position: 'absolute',
 overflow: 'hidden'
	})
	.append($img2)

var $hdl_holder = $('<div />')/*{{{*/
	.width(pct(100)).height(pct(100))
	.css('zIndex',320);

var $sel = $('<div />')/*{{{*/
	.css({
 position: 'absolute',
 zIndex: 300
	})
	.insertBefore($img)
	.append($img_holder,$hdl_holder)

var bound = options.boundary;
var $trk = newTracker().width(boundx+(bound*2)).height(boundy+(bound*2))
	.css({ position: 'absolute', top: px(-bound), left: px(-bound), zIndex: 290 })
	.mousedown(newSelection);

/ }}} /
// Set more variables {{{

var xlimit, ylimit, xmin, ymin;
var xscale, yscale, enabled = true;
var docOffset = getPos($img),
	// Internal states
	btndown, lastcurs, dimmed, animating,
	shift_down;

// }}}

// }}}
// Internal Modules {{{

var Coords = function()/{{{/
{

	var x1 = 0, y1 = 0, x2 = 0, y2 = 0, ox, oy;

	function setPressed(pos)/*{{{*/
	{
 var pos = rebound(pos);
 x2 = x1 = pos[0];
 y2 = y1 = pos[1];
	};
	/*}}}*/
	function setCurrent(pos)/*{{{*/
	{
 var pos = rebound(pos);
 ox = pos[0] - x2;
 oy = pos[1] - y2;
 x2 = pos[0];
 y2 = pos[1];
	};
	/*}}}*/
	function getOffset()/*{{{*/
	{
 return [ ox, oy ];
	};
	/*}}}*/
	function moveOffset(offset)/*{{{*/
	{
 var ox = offset[0], oy = offset[1];

 if (0 > x1 + ox) ox -= ox + x1;
 if (0 > y1 + oy) oy -= oy + y1;

 if (boundy < y2 + oy) oy += boundy - (y2 + oy);
 if (boundx < x2 + ox) ox += boundx - (x2 + ox);

 x1 += ox;
 x2 += ox;
 y1 += oy;
 y2 += oy;
	};
	/*}}}*/
	function getCorner(ord)/*{{{*/
	{
 var c = getFixed();
 switch(ord)
 {
 case 'ne': return [ c.x2, c.y ];
 case 'nw': return [ c.x, c.y ];
 case 'se': return [ c.x2, c.y2 ];
 case 'sw': return [ c.x, c.y2 ];
 }
	};
	/*}}}*/
	function getFixed()/*{{{*/
	{
 if (!options.aspectRatio) return getRect();
 // This function could use some optimization I think...
 var aspect = options.aspectRatio,
 min_x = options.minSize[0]/xscale,
 min_y = options.minSize[1]/yscale,
 max_x = options.maxSize[0]/xscale,
 max_y = options.maxSize[1]/yscale,
 rw = x2 - x1,
 rh = y2 - y1,
 rwa = Math.abs(rw),
 rha = Math.abs(rh),
 real_ratio = rwa / rha,
 xx, yy
 ;
 if (max_x == 0) { max_x = boundx * 10 }
 if (max_y == 0) { max_y = boundy * 10 }
 if (real_ratio < aspect)
 {
 yy = y2;
 w = rha * aspect;
 xx = rw < 0 ? x1 - w : w + x1;

 if (xx < 0)
 {
 xx = 0;
 h = Math.abs((xx - x1) / aspect);
 yy = rh < 0 ? y1 - h: h + y1;
 }
 else if (xx > boundx)
 {
 xx = boundx;
 h = Math.abs((xx - x1) / aspect);
 yy = rh < 0 ? y1 - h : h + y1;
 }
 }
 else
 {
 xx = x2;
 h = rwa / aspect;
 yy = rh < 0 ? y1 - h : y1 + h;
 if (yy < 0)
 {
 yy = 0;
 w = Math.abs((yy - y1) * aspect);
 xx = rw < 0 ? x1 - w : w + x1;
 }
 else if (yy > boundy)
 {
 yy = boundy;
 w = Math.abs(yy - y1) * aspect;
 xx = rw < 0 ? x1 - w : w + x1;
 }
 }

 // Magic %-)
 if(xx > x1) { // right side
 if(xx - x1 < min_x) {
 xx = x1 + min_x;
 } else if (xx - x1 > max_x) {
 xx = x1 + max_x;
 }
 if(yy > y1) {
 yy = y1 + (xx - x1)/aspect;
 } else {
 yy = y1 - (xx - x1)/aspect;
 }
 } else if (xx < x1) { // left side
 if(x1 - xx < min_x) {
 xx = x1 - min_x
 } else if (x1 - xx > max_x) {
 xx = x1 - max_x;
 }
 if(yy > y1) {
 yy = y1 + (x1 - xx)/aspect;
 } else {
 yy = y1 - (x1 - xx)/aspect;
 }
 }

 if(xx < 0) {
 x1 -= xx;
 xx = 0;
 } else if (xx > boundx) {
 x1 -= xx - boundx;
 xx = boundx;
 }

 if(yy < 0) {
 y1 -= yy;
 yy = 0;
 } else if (yy > boundy) {
 y1 -= yy - boundy;
 yy = boundy;
 }

 return last = makeObj(flipCoords(x1,y1,xx,yy));
	};
	/*}}}*/
	function rebound(p)/*{{{*/
	{
 if (p[0] < 0) p[0] = 0;
 if (p[1] < 0) p[1] = 0;

 if (p[0] > boundx) p[0] = boundx;
 if (p[1] > boundy) p[1] = boundy;

 return [ p[0], p[1] ];
	};
	/*}}}*/
	function flipCoords(x1,y1,x2,y2)/*{{{*/
	{
 var xa = x1, xb = x2, ya = y1, yb = y2;
 if (x2 < x1)
 {
 xa = x2;
 xb = x1;
 }
 if (y2 < y1)
 {
 ya = y2;
 yb = y1;
 }
 return [ Math.round(xa), Math.round(ya), Math.round(xb), Math.round(yb) ];
	};
	/*}}}*/
	function getRect()/*{{{*/
	{
 var xsize = x2 - x1;
 var ysize = y2 - y1;

 if (xlimit && (Math.abs(xsize) > xlimit))
 x2 = (xsize > 0) ? (x1 + xlimit) : (x1 - xlimit);
 if (ylimit && (Math.abs(ysize) > ylimit))
 y2 = (ysize > 0) ? (y1 + ylimit) : (y1 - ylimit);

 if (ymin && (Math.abs(ysize) < ymin))
 y2 = (ysize > 0) ? (y1 + ymin) : (y1 - ymin);
 if (xmin && (Math.abs(xsize) < xmin))
 x2 = (xsize > 0) ? (x1 + xmin) : (x1 - xmin);

 if (x1 < 0) { x2 -= x1; x1 -= x1; }
 if (y1 < 0) { y2 -= y1; y1 -= y1; }
 if (x2 < 0) { x1 -= x2; x2 -= x2; }
 if (y2 < 0) { y1 -= y2; y2 -= y2; }
 if (x2 > boundx) { var delta = x2 - boundx; x1 -= delta; x2 -= delta; }
 if (y2 > boundy) { var delta = y2 - boundy; y1 -= delta; y2 -= delta; }
 if (x1 > boundx) { var delta = x1 - boundy; y2 -= delta; y1 -= delta; }
 if (y1 > boundy) { var delta = y1 - boundy; y2 -= delta; y1 -= delta; }

 return makeObj(flipCoords(x1,y1,x2,y2));
	};
	/*}}}*/
	function makeObj(a)/*{{{*/
	{
 return { x: a[0], y: a[1], x2: a[2], y2: a[3],
 w: a[2] - a[0], h: a[3] - a[1] };
	};
	/*}}}*/

	return {
 flipCoords: flipCoords,
 setPressed: setPressed,
 setCurrent: setCurrent,
 getOffset: getOffset,
 moveOffset: moveOffset,
 getCorner: getCorner,
 getFixed: getFixed
	};
}();

/}}}/
var Selection = function()/{{{/
{

	var start, end, dragmode, awake, hdep = 370;
	var borders = { };
	var handle = { };
	var seehandles = false;
	var hhs = options.handleOffset;

	/* Insert draggable elements {{{*/

	// Insert border divs for outline
	if (options.drawBorders) {
 borders = {
 top: insertBorder('hline')
 .css('top',$.browser.msie?px(-1):px(0)),
 bottom: insertBorder('hline'),
 left: insertBorder('vline'),
 right: insertBorder('vline')
 };
	}

	// Insert handles on edges
	if (options.dragEdges) {
 handle.t = insertDragbar('n');
 handle.b = insertDragbar('s');
 handle.r = insertDragbar('e');
 handle.l = insertDragbar('w');
	}

	// Insert side handles
	options.sideHandles &&
 createHandles(['n','s','e','w']);

	// Insert corner handles
	options.cornerHandles &&
 createHandles(['sw','nw','ne','se']);

	/*}}}*/
	// Private Methods
	function insertBorder(type)/*{{{*/
	{
 var jq = $('<div />')
 .css({position: 'absolute', opacity: options.borderOpacity })
 .addClass(cssClass(type));
 $img_holder.append(jq);
 return jq;
	};
	/*}}}*/
	function dragDiv(ord,zi)/*{{{*/
	{
 var jq = $('<div />')
 .mousedown(createDragger(ord))
 .css({
 cursor: ord+'-resize',
 position: 'absolute',
 zIndex: zi
 })
 ;
 $hdl_holder.append(jq);
 return jq;
	};
	/*}}}*/
	function insertHandle(ord)/*{{{*/
	{
 return dragDiv(ord,hdep++)
 .css({ top: px(-hhs+1), left: px(-hhs+1), opacity: options.handleOpacity })
 .addClass(cssClass('handle'));
	};
	/*}}}*/
	function insertDragbar(ord)/*{{{*/
	{
 var s = options.handleSize,
 o = hhs,
 h = s, w = s,
 t = o, l = o;

 switch(ord)
 {
 case 'n': case 's': w = pct(100); break;
 case 'e': case 'w': h = pct(100); break;
 }

 return dragDiv(ord,hdep++).width(w).height(h)
 .css({ top: px(-t+1), left: px(-l+1)});
	};
	/*}}}*/
	function createHandles(li)/*{{{*/
	{
 for(i in li) handle[li[i]] = insertHandle(li[i]);
	};
	/*}}}*/
	function moveHandles(c)/*{{{*/
	{
 var midvert = Math.round((c.h / 2) - hhs),
 midhoriz = Math.round((c.w / 2) - hhs),
 north = west = -hhs+1,
 east = c.w - hhs,
 south = c.h - hhs,
 x, y;

 'e' in handle &&
 handle.e.css({ top: px(midvert), left: px(east) }) &&
 handle.w.css({ top: px(midvert) }) &&
 handle.s.css({ top: px(south), left: px(midhoriz) }) &&
 handle.n.css({ left: px(midhoriz) });

 'ne' in handle &&
 handle.ne.css({ left: px(east) }) &&
 handle.se.css({ top: px(south), left: px(east) }) &&
 handle.sw.css({ top: px(south) });

 'b' in handle &&
 handle.b.css({ top: px(south) }) &&
 handle.r.css({ left: px(east) });
	};
	/*}}}*/
	function moveto(x,y)/*{{{*/
	{
 $img2.css({ top: px(-y), left: px(-x) });
 $sel.css({ top: px(y), left: px(x) });
	};
	/*}}}*/
	function resize(w,h)/*{{{*/
	{
 $sel.width(w).height(h);
	};
	/*}}}*/
	function refresh()/*{{{*/
	{
 var c = Coords.getFixed();

 Coords.setPressed([c.x,c.y]);
 Coords.setCurrent([c.x2,c.y2]);

 updateVisible();
	};
	/*}}}*/

	// Internal Methods
	function updateVisible()/*{{{*/
 { if (awake) return update(); };
	/*}}}*/
	function update()/*{{{*/
	{
 var c = Coords.getFixed();

 resize(c.w,c.h);
 moveto(c.x,c.y);

 options.drawBorders &&
 borders['right'].css({ left: px(c.w-1) }) &&
 borders['bottom'].css({ top: px(c.h-1) });

 seehandles && moveHandles(c);
 awake || show();

 options.onChange(unscale(c));
	};
	/*}}}*/
	function show()/*{{{*/
	{
 $sel.show();
 $img.css('opacity',options.bgOpacity);
 awake = true;
	};
	/*}}}*/
	function release()/*{{{*/
	{
 disableHandles();
 $sel.hide();
 $img.css('opacity',1);
 awake = false;
	};
	/*}}}*/
	function showHandles()//{{{
	{
 if (seehandles)
 {
 moveHandles(Coords.getFixed());
 $hdl_holder.show();
 }
	};
	//}}}
	function enableHandles()/*{{{*/
	{
 seehandles = true;
 if (options.allowResize)
 {
 moveHandles(Coords.getFixed());
 $hdl_holder.show();
 return true;
 }
	};
	/*}}}*/
	function disableHandles()/*{{{*/
	{
 seehandles = false;
 $hdl_holder.hide();
	};
	/*}}}*/
	function animMode(v)/*{{{*/
	{
 (animating = v) ? disableHandles(): enableHandles();
	};
	/*}}}*/
	function done()/*{{{*/
	{
 animMode(false);
 refresh();
	};
	/*}}}*/

	var $track = newTracker().mousedown(createDragger('move'))
 .css({ cursor: 'move', position: 'absolute', zIndex: 360 })

	$img_holder.append($track);
	disableHandles();

	return {
 updateVisible: updateVisible,
 update: update,
 release: release,
 refresh: refresh,
 setCursor: function (cursor) { $track.css('cursor',cursor); },
 enableHandles: enableHandles,
 enableOnly: function() { seehandles = true; },
 showHandles: showHandles,
 disableHandles: disableHandles,
 animMode: animMode,
 done: done
	};
}();

	var onMove = function() { },
 onDone = function() { },
 trackDoc	= options.trackDocument;

	if (!trackDoc)
	{
 $trk
 .mousemove(trackMove)
 .mouseup(trackUp)
 .mouseout(trackUp)
 ;
	}

	function toFront()/*{{{*/
	{
 $trk.css({zIndex:450});
 if (trackDoc)
 {
 $(document)
 .mousemove(trackMove)
 .mouseup(trackUp)
 ;
 }
	}
	/*}}}*/
	function toBack()/*{{{*/
	{
 $trk.css({zIndex:290});
 if (trackDoc)
 {
 $(document)
 .unbind('mousemove',trackMove)
 .unbind('mouseup',trackUp)
 ;
 }
	}
	/*}}}*/
	function trackMove(e)/*{{{*/
	{
 onMove(mouseAbs(e));
	};
	/*}}}*/
	function trackUp(e)/*{{{*/
	{
 e.preventDefault();
 e.stopPropagation();

 if (btndown)
 {
 btndown = false;

 onDone(mouseAbs(e));
 options.onSelect(unscale(Coords.getFixed()));
 toBack();
 onMove = function() { };
 onDone = function() { };
 }

 return false;
	};
	/*}}}*/

	function activateHandlers(move,done)/* {{{ */
	{
 btndown = true;
 onMove = move;
 onDone = done;
 toFront();
 return false;
	};
	/* }}} */

	function setCursor(t) { $trk.css('cursor',t); };

	$img.before($trk);
	return {
 activateHandlers: activateHandlers,
 setCursor: setCursor
	};
}();

	var $keymgr = $('<input type="radio" />')
 .css({ position: 'absolute', left: '-30px' })
 .keypress(parseKey)
 .blur(onBlur),

 $keywrap = $('<div />')
 .css({
 position: 'absolute',
 overflow: 'hidden'
 })
 .append($keymgr)
	;

	function watchKeys()/*{{{*/
	{
 if (options.keySupport)
 {
 $keymgr.show();
 $keymgr.focus();
 }
	};
	/*}}}*/
	function onBlur(e)/*{{{*/
	{
 $keymgr.hide();
	};
	/*}}}*/
	function doNudge(e,x,y)/*{{{*/
	{
 if (options.allowMove) {
 Coords.moveOffset([x,y]);
 Selection.updateVisible();
 };
 e.preventDefault();
 e.stopPropagation();
	};
	/*}}}*/
	function parseKey(e)/*{{{*/
	{
 if (e.ctrlKey) return true;
 shift_down = e.shiftKey ? true : false;
 var nudge = shift_down ? 10 : 1;
 switch(e.keyCode)
 {
 case 37: doNudge(e,-nudge,0); break;
 case 39: doNudge(e,nudge,0); break;
 case 38: doNudge(e,0,-nudge); break;
 case 40: doNudge(e,0,nudge); break;

 case 27: Selection.release(); break;

 case 9: return true;
 }

 return nothing(e);
	};
	/*}}}*/

	if (options.keySupport) $keywrap.insertBefore($img);
	return {
 watchKeys: watchKeys
	};
}();

// }}}
// Internal Methods {{{

function px(n) { return '' + parseInt(n) + 'px'; };
function pct(n) { return '' + parseInt(n) + '%'; };
function cssClass(cl) { return options.baseClass + '-' + cl; };
function getPos(obj)/*{{{*/

	var pos = $(obj).offset();
	return [ pos.left, pos.top ];
};

	return [ (e.pageX - docOffset[0]), (e.pageY - docOffset[1]) ];
};

	if (type != lastcurs)
	{
 Tracker.setCursor(type);
 //Handles.xsetCursor(type);
 lastcurs = type;
	}
};

	docOffset = getPos($img);
	Tracker.setCursor(mode=='move'?mode:mode+'-resize');

	if (mode == 'move')
 return Tracker.activateHandlers(createMover(pos), doneSelect);

	var fc = Coords.getFixed();
	var opp = oppLockCorner(mode);
	var opc = Coords.getCorner(oppLockCorner(opp));

	Coords.setPressed(Coords.getCorner(opp));
	Coords.setCurrent(opc);

	Tracker.activateHandlers(dragmodeHandler(mode,fc),doneSelect);
};

	return function(pos) {
 if (!options.aspectRatio) switch(mode)
 {
 case 'e': pos[1] = f.y2; break;
 case 'w': pos[1] = f.y2; break;
 case 'n': pos[0] = f.x2; break;
 case 's': pos[0] = f.x2; break;
 }
 else switch(mode)
 {
 case 'e': pos[1] = f.y+1; break;
 case 'w': pos[1] = f.y+1; break;
 case 'n': pos[0] = f.x+1; break;
 case 's': pos[0] = f.x+1; break;
 }
 Coords.setCurrent(pos);
 Selection.update();
	};
};

	var lloc = pos;
	KeyManager.watchKeys();

	return function(pos)
	{
 Coords.moveOffset([pos[0] - lloc[0], pos[1] - lloc[1]]);
 lloc = pos;

 Selection.update();
	};
};

 case 'n': return 'sw';
 case 's': return 'nw';
 case 'e': return 'nw';
 case 'w': return 'ne';
 case 'ne': return 'sw';
 case 'nw': return 'se';
 case 'se': return 'nw';
 case 'sw': return 'ne';
	};
};

	return function(e) {
 if (options.disabled) return false;
 if ((ord == 'move') && !options.allowMove) return false;
 btndown = true;
 startDragMode(ord,mouseAbs(e));
 e.stopPropagation();
 e.preventDefault();
 return false;
	};
};

	var nw = $obj.width(), nh = $obj.height();
	if ((nw > w) && w > 0)
	{
 nw = w;
 nh = (w/$obj.width()) * $obj.height();
	}
	if ((nh > h) && h > 0)
	{
 nh = h;
 nw = (h/$obj.height()) * $obj.width();
	}
	xscale = $obj.width() / nw;
	yscale = $obj.height() / nh;
	$obj.width(nw).height(nh);
};

	return {
 x: parseInt(c.x * xscale), y: parseInt(c.y * yscale),
 x2: parseInt(c.x2 * xscale), y2: parseInt(c.y2 * yscale),
 w: parseInt(c.w * xscale), h: parseInt(c.h * yscale)
	};
};

	var c = Coords.getFixed();
	if (c.w > options.minSelect[0] && c.h > options.minSelect[1])
	{
 Selection.enableHandles();
 Selection.done();
	}
	else
	{
 Selection.release();
	}
	Tracker.setCursor( options.allowSelect?'crosshair':'default' );
};

	if (options.disabled) return false;
	if (!options.allowSelect) return false;
	btndown = true;
	docOffset = getPos($img);
	Selection.disableHandles();
	myCursor('crosshair');
	var pos = mouseAbs(e);
	Coords.setPressed(pos);
	Tracker.activateHandlers(selectDrag,doneSelect);
	KeyManager.watchKeys();
	Selection.update();

	e.stopPropagation();
	e.preventDefault();
	return false;
};

	Coords.setCurrent(pos);
	Selection.update();
};

	var trk = $('<div></div>').addClass(cssClass('tracker'));
	$.browser.msie && trk.css({ opacity: 0, backgroundColor: 'white' });
	return trk;
};

// }}}
// API methods {{{

function animateTo(a)/{{{/
{

	var x1 = a[0] / xscale,
 y1 = a[1] / yscale,
 x2 = a[2] / xscale,
 y2 = a[3] / yscale;

	if (animating) return;

	var animto = Coords.flipCoords(x1,y1,x2,y2);
	var c = Coords.getFixed();
	var animat = initcr = [ c.x, c.y, c.x2, c.y2 ];
	var interv = options.animationDelay;

	var x = animat[0];
	var y = animat[1];
	var x2 = animat[2];
	var y2 = animat[3];
	var ix1 = animto[0] - initcr[0];
	var iy1 = animto[1] - initcr[1];
	var ix2 = animto[2] - initcr[2];
	var iy2 = animto[3] - initcr[3];
	var pcent = 0;
	var velocity = options.swingSpeed;

	Selection.animMode(true);

	var animator = function()
	{
 return function()
 {
 pcent += (100 - pcent) / velocity;

 animat[0] = x + ((pcent / 100) * ix1);
 animat[1] = y + ((pcent / 100) * iy1);
 animat[2] = x2 + ((pcent / 100) * ix2);
 animat[3] = y2 + ((pcent / 100) * iy2);

 if (pcent < 100) animateStart();
 else Selection.done();

 if (pcent >= 99.8) pcent = 100;

 setSelectRaw(animat);
 };
	}();

	function animateStart()
 { window.setTimeout(animator,interv); };

	animateStart();
};

	setSelectRaw([rect[0]/xscale,rect[1]/yscale,rect[2]/xscale,rect[3]/yscale]);
};

	Coords.setPressed([l[0],l[1]]);
	Coords.setCurrent([l[2],l[3]]);
	Selection.update();
};

	if (typeof(opt) != 'object') opt = { };
	options = $.extend(options,opt);

	if (typeof(options.onChange)!=='function')
 options.onChange = function() { };

	if (typeof(options.onSelect)!=='function')
 options.onSelect = function() { };

};

	return unscale(Coords.getFixed());
};

	return Coords.getFixed();
};

	setOptions(opt);
	interfaceUpdate();
};

	options.disabled = true;
	Selection.disableHandles();
	Selection.setCursor('default');
	Tracker.setCursor('default');
};

	options.disabled = false;
	interfaceUpdate();
};

	Selection.done();
	Tracker.activateHandlers(null,null);
};

	$div.remove();
	$origimg.show();
};

function interfaceUpdate(alt)//{{{
// This method tweaks the interface based on options object.
// Called when options are changed and at end of initialization.
{
options.allowResize ?
alt?Selection.enableOnly():Selection.enableHandles():

 Selection.disableHandles();

	Tracker.setCursor( options.allowSelect? 'crosshair': 'default' );
	Selection.setCursor( options.allowMove? 'move': 'default' );

	$div.css('backgroundColor',options.bgColor);

	if ('setSelect' in options) {
 setSelect(opt.setSelect);
 Selection.done();
 delete(options.setSelect);
	}

	if ('trueSize' in options) {
 xscale = options.trueSize[0] / boundx;
 yscale = options.trueSize[1] / boundy;
	}

	xlimit = options.maxSize[0] || 0;
	ylimit = options.maxSize[1] || 0;
	xmin = options.minSize[0] || 0;
	ymin = options.minSize[1] || 0;

	if ('outerImage' in options)
	{
 $img.attr('src',options.outerImage);
 delete(options.outerImage);
	}

	Selection.refresh();
};

// }}}

$hdl_holder.hide();
interfaceUpdate(true);

var api = {
	animateTo: animateTo,
	setSelect: setSelect,
	setOptions: setOptionsNew,
	tellSelect: tellSelect,
	tellScaled: tellScaled,

	disable: disableCrop,
	enable: enableCrop,
	cancel: cancelCrop,

	focus: KeyManager.watchKeys,

	getBounds: function() { return [ boundx * xscale, boundy * yscale ]; },
	getWidgetSize: function() { return [ boundx, boundy ]; },

	release: Selection.release,
	destroy: destroy

};

$origimg.data('Jcrop',api);
return api;
};

$.fn.Jcrop = function(options)/*{{{*/

	var loadsrc = options.useImg || from.src;
	var img = new Image();
	img.onload = function() { $.Jcrop(from,options); };
	img.src = loadsrc;
};

// Iterate over each object, attach Jcrop
this.each(function()
{
// If we've already attached to this object
if ($(this).data('Jcrop'))
{
// The API can be requested this way (undocumented)

 if (options == 'api') return $(this).data('Jcrop');
 // Otherwise, we just reset the options...
 else $(this).data('Jcrop').setOptions(options);
	}
	// If we haven't been attached, preload and attach
	else attachWhenDone(this);
});

// Return "this" so we're chainable a la jQuery plugin-style!

return this;
};

})(jQuery);

Use o eq

$('.nomedaclasse').eq(0).html()
$('.nomedaclasse').eq(1).html()

Rafael funcionou PERFEITAMENTE! Muito grato, não conhecia o eq.

Grato \o/

testei assim:

function lou1() {

$('.jcrop-tracker').eq(0).css('background-color', 'blue','border','3px solid blue');

}

 

function lou2()	{

$('.jcrop-tracker').eq(1).css('background-color','red','border','3px solid red');

}

^^

conheci a pouco tempo também.

Eu também não conhecia essa funcao eq(). Só que eu não estava entendo como ele criava sozinho as div, agora eu vi, bem legal esse Jcrop. Tenho uma boa experiência programando, então as vezes consigo ajudar por isso. Mas a dica do Rafael foi execelente isso ae Rafael.

Obrigado :thumbsup:

Perfeito! Muito bom trocar conhecimentos.

Aos interessados. Estou na segunda etapa do projeto em -> ARRASTAR IMAGEM DENTRO DE DIV

abraço!