Дано:
Галерея imagelightbox, т.е картинка с со свойствами position absolute, left 0, right 0, top 0, bottom 0, margin auto, width 100% (то есть централизована и растянута по ширине/высоте окна - смотря что больше). Все эти свойства в important, так как скрипт галереи высчитывает центр окна и вешает картинку по центру с маленькой шириной - примерно в половину окна.
Инициализируется вся эта шляпа только на мобилках.
Нужно:
Приближать картинку по нажатию и таскать её по экрану.
В чём у меня загвоздка...
на touchstart даю картинке scale(1.5) - тут всё просто.
В touchmove у меня начинаются проблемы. Никак не пойму как зацепить координату, на которую нажали и передать её в стили так, чтобы анкорпоинт переместился в эту координату и, относительно неё уже высчитывался translate?
Пробовал в transform-origin передать clientX и clientY - получается какой-то реверсивный п"№;%:?*№%?!:"%.
Пробовал передавать их в translate... лучше б не пробовал.
Пробовал отнять от центра окна координаты нажатия - был близок, но при нажатии на край картинки на координату нажатия смещается центр картинки.
Вообщем в геометрии я пЛОХ.
Сейчас всё примерно так:
var X = e.originalEvent.touches[0].clientX;
var Y = e.originalEvent.touches[0].clientY;
var centerX = $(window).outerWidth()/2;
var centerY = $(window).outerHeight()/2;
if($(this).hasClass('looped')){
$(this).css({"-webkit-transform":"translate(" + (X - centerX) +"px ,"+(Y - centerY) +"px) scale(2)"});
$(this).css({"transform":"translate(" + (X - centerX) +"px ,"+(Y - centerY) +"px) scale(2)"});
return false;
Подскажите, пожалуйста, как, при тачмуве перемещать картинку не от её центра, а от координаты нажатия на картинку?
Всем заранее спасибо за ответы.
