Javascript-форум (https://javascript.ru/forum/)
-   Events/DOM/Window (https://javascript.ru/forum/events/)
-   -   как сделать img zoom (https://javascript.ru/forum/events/30784-kak-sdelat-img-zoom.html)

cyber 15.08.2012 19:35

как сделать img zoom
 
делаю зум как тут http://rvolve.com/zoom_pic.php, только там на канве, а у меня нет.Так вот делаю так:
function fixedZoom (x,y) {

var top = getHeight / height;//zoom
var left = getWidth / width; 	//zoom

var centerX = elem.width()/2;//центр по Х
var centerY = elem.height()/2;//центр по Y

x = x - coord_elem.left;//координаты мыши относительно блока по X
y = y - coord_elem.top;//координаты мыши относительно блока по Y

x = centerX - x;
y = centerY - y;
console.log(x*left)	 
	 
	 wrapper.css({
		 top: style().top + y*top + 'px',
		 left: style().left + x*left+'px'
		 		
		 })
	
	}


только увелечение не по клику а колесиком
но что как то не так работает http://cyberua.16mb.com/files/zoom.html.
что делаю нет так?

Deff 15.08.2012 19:53

cyber,
При зуме нужно фиксировать текущую координату мыши от лево - и верха Окна Самой внешней обертки overlow
Поэтому расчитываете координаты и относительно wrapper и обертки overlow, - и wrapper cдвигаете - top и -left на величину разницу - между старыми координатами мыши от угла overlow и приращением ширины и высоты (*или уменьшением - тогда получецо авто плюс)

cyber 15.08.2012 20:23

раз 3 прочитал и не совсем понял
Цитата:

координату мыши от лево - право
т.е отступ с лева - отступ с права?

чет я как то запутался=(

Deff 15.08.2012 21:08

cyber,
Координаты мыши от лева и тоp (cоррь

cyber 15.08.2012 22:17

Цитата:

Сообщение от Deff (Сообщение 197824)
cyber,
При зуме нужно фиксировать текущую координату мыши от лево - и верха Окна Самой внешней обертки overlow
Поэтому расчитываете координаты и относительно wrapper и обертки overlow, - и wrapper cдвигаете - top и -left на величину разницу - между старыми координатами мыши от угла overlow и приращением ширины и высоты (*или уменьшением - тогда получецо авто плюс)

блин, я наверно запутался но я вроде так и делаю=(

cyber 15.08.2012 22:36

Цитата:

Сообщение от Deff (Сообщение 197824)
cyber,
а
Поэтому расчитываете координаты и относительно wrapper

т.е top , left?

Deff 15.08.2012 22:39

т.е top , left - Да

cyber 15.08.2012 23:49

function fixedZoom (x,y) {

var top = getHeight / height;//zoom
var left = getWidth / width; 	//zoom

var centerX = elem.width()/2;//центр по Х
var centerY = elem.height()/2;//центр по Y

x = x - coord_elem.left;//координаты мыши относительно блока по X
y = y - coord_elem.top;//координаты мыши относительно блока по Y

x = centerX - x;
y = centerY - y;
console.log(x*left)	 
	 
	 wrapper.css({
		 top: style().top + y*top + 'px',
		 left: style().left + x*left+'px'
		 		
		 })
	
	}

style().left/top
это значение left/top для wrapper
y/x координаты курсора
я твой алгоритм вроде частично понял (как то запутано написано:)), но не пойму что именно у меня не так

Deff 16.08.2012 00:24

cyber,
Сплю - завтра к после обеда наверно

cyber 16.08.2012 00:38

да сам засыпаю,спокойной ночи)))


Часовой пояс GMT +3, время: 13:53.