проблемы с jQuery и оптимизацией
 

вот тут http://cyberua.16mb.com/files/zoom.html есть скрипт (что то типо мини карты ) но он ужасно виснит не понятно почему.
в мозиле вылетает такое сообщение
как я понимаю проблема в jQuery , если да то что можно сделать?

cyber,
что-то да есть. Чем больше двигаю, тем больше лаги. Может где-то зациклена функция??? Потому что сначало все ок, а уж потом плохенько.

не первый мой drag and drop , до этого все ок получалось с ними , но первый на jQuery , короче вот код
смотрите сами

function init_drag (e) {

move = true;
var margin = getMargin();

  downX = e.pageX + Math.abs(margin.left) - coord_elem.left;
  downY = e.pageY + Math.abs(margin.top) - coord_elem.top; 

  $(document).on('mousemove', wrapper);	
  $(document).on('mouseup', MouseUp);	
	
	}

function wrapper(e) {
	  
if (move) setTimeout(function (){
	MouseMove(e);
	},30);
	  
	  }


function MouseMove (e) {

var left, top;
var pgX = e.pageX - coord_elem.left;
var pgY = e.pageY - coord_elem.top;



 
left =  - (downX - pgX);
	
left = Math.min(left, 0);	
left = Math.max(left, - (img.width() - elem.width()));	


top = -(downY - pgY);
top = Math.min(top, 0);

top = Math.max(top, -(img.height() - elem.height()));


img.css({
	'margin-top': top+ 'px',
	'margin-left':left + 'px'
	});
}
	
	
function MouseUp () {
	
move = false;	
$(document).unbind('mousemove', wrapper);
$(document).on('mouseup', MouseUp);	
	}	

function getMargin () {
	
 var top = parseInt(img[0].style.marginTop);
var left = parseInt(img[0].style.marginLeft);
	
return {top: top, left: left};	
}

хм интересно, у меня была не большая ошибка
в место

$(document).unbind('mouseup', MouseUp);

я написал

$(document).on('mouseup', MouseUp);

и теперь вроде все норм, но почему из за такой маленькой ошибки так его плющило?

cyber,
Гы .unbind отключает обработчик - .on('mouseup', MouseUp) - ставит новый обработчик

я знаю , не внимательность меня доконает=)
кстати а как можно оптимизировать что бы было меньши тормозов?

cyber,
Ксать я не наю
вот это верно ?
$(document).on('mousemove', wrapper);
(просто я со старыми версиями, где оn нет
Если обработчик подключается bind то отключается unbind
Про on - не знаю

я сам в jQuery шарю плохо(этой мой первый и наверно последний скрипт на jquery), но с on работает и unbind убирает обработчик вроде работает=)

по этой ссылке http://gmap.nurtext.de/examples.html есть мини гугл карта (4я с верху), при перемещение карты позиция точек не меняется но почему то они остаются на месте, как это сделано не могу понять

неужели никто не знает?

cyber,
Я завтра гляну - засыпаю уже

:thanks: , а я пока сам буду мучать если получится отпишусь

кажется понял :
у гугла карта разбита на блоки и когда я двигаю я двигаю общий контейнер , так как у точки позиция относительно контейнера поэтому она и не двигается

Вы же вроде спрашивали тут ? http://javascript.ru/forum/events/30...tml#post195321
масштабирование не помогло ? При оnscroll нужно менять не только масштаб у карты но и так же само масштаб у координат <div class="point_on_map"></div>

маштаб работает, но у у меня ще карта двигается как (drag and drop) а значить и точки должны двигается http://cyberua.16mb.com/files/zoom.html
и мне было интересно почему у них точки при перемещение не смещаются..

cyber,
а где у Вас добавления смещения при drag and drop к <div class="point_on_map"></div> ?

у меня пока нет, мне просто было интересно как это реализовано на гугл мап если точки при drag and drop остаются на месте.
и я вроде разобрался

cyber,
Ну сделайте контейнер с картой - postion relative(или абсолюте) - тогда - если точки у Вас внутри контейнера - то будет аналогично вместе с картой

я так и сделал =)

блин опять что то не так
при увеличение все работает, но при уменьшение не правильно

function resize_zoom (i) {
	
var point, top, left, posLeft, posTop;	

    point = points.eq(i);
    
	posLeft = point.offset().left - coord_elem.left;//текущая позиция точки
	posTop = point.offset().top - coord_elem.top;//текущая позиция точки
	
    top = (getHeight / (getHeight - step.height))/*
get(Height/Width) размер картинки после увлечения
step.height на сколько увеличить высоту
*/
    left = (getWidth / (getWidth - step.width));


	 if (!zoom) {// если zoom false уменьшаем
		
	    top = (getHeight / (getHeight + step.height));
         left = (getWidth / (getWidth + step.width));
		 
		 }	
		 
 return {
	 top: Math.round(top * posTop), 
	 left: Math.round(left * posLeft), 
	 point: point
	 }		 
	
	}	

}

Ну ды ты не так сделал - саму карту <img id='img' src='img/general1.jpg' /> вместе с пойнтерами нун обернуть врапером с релативе - и drag and drop не картинку а враппер - а тот div id=map - он статичный и еще и overflow:

я по той ссылке просто код не поменял=)

обновил http://cyberua.16mb.com/files/zoom.html

Если картинку обернуть вместе с пойнтерами враппером - смещать пойнтеры не нужно ток ты им исходную позицию задавай не top left
а margin-top и margin-left и они должны стоять перед картинкой карты (ксать с margin мож и без обёртки пройдёт

не пройдет, а с обертkой лучше юзать top left

блин до этого работало все норм нечего не могу понять , и только на умешение работает криво :help:

cyber,
Попробуйте отдохнуть - имхо вы замучали код и себя - лучше свежая голова!

мне заказчик весь мозг уже проел, не могу.
просто у меня уже все готово нужно просто добавить еще 1 готовый внешний файл и до делать позиционирование точек при уменьшение

короче с точками проблемы, ездят как хотят(не только при уменьшение) ,завтра разберусь

что я не так делаю :
-что бы получить зум при увеличении я делаю так :
текущий размер/ предыдущий размер;

-что бы получить зум при уменьшение я делаю так :
предыдущий размер / текущий размер

cyber,
Неть - формула везде одна и таж
текущий размер/ предыдущий размер;

Deff, ваш комментарий http://javascript.ru/forum/events/30...tml#post195321

вот что получается если так сделать http://cyberua.16mb.com/files/zoom.html

cyber,
Вообщем норма - ток неясно нафига ти
img {


width:1600px;
height:900px;
cursor: move;
-webkit-transition:all 2s ease;
-moz-transition:all 2s ease;
-o-transition:all 2s ease;
transition:all 2s ease;
}
Красное на карту добавил ?? или время сократи до 0.2

что бы не было тормозов при увлечение.)

т.е норма? точки смещаются с исходной позиции - это не норм.

cyber,
В Опере норма - ксать убери красное - имхо - лучше ( тормозов не вижу нигде) А в Мозилле и Гугле имхо наверно или отсекаешь дробную часть(там оффсеты дробные) - из-за этого погрешность либо маргин и паддинги где-то лишние потестируй там маргин и паддинг алертом при зуме

Воть в JQ высота - ширина http://jquery-docs.ru/CSS/height/
http://jquery-docs.ru/CSS/height/#val
http://jquery-docs.ru/CSS/width/
http://jquery-docs.ru/CSS/width/#val

у моего заказчика без этих костыле тормозит...
в опере при уменьшение точки летают как "птицы" (ну меня точно)

а насчет высоты и ширины я ее так и получаю

var getWidth =  img.width();
var getHeight = img.height();

а какая разница между

img.height(getHeight);
	 img.width(getWidth);

и

img.css({
		 width : getWidth +'px',
		 height: getHeight + 'px',
		 });

cyber,
Забей - а то я тьву еще больше запутаю