Подскажите как вырезать из изображения указанный пользователем кусок. То есть уже на подгруженном изображении должна быть зона которую можно двигать и выбрать место которое кадрировать далее. Причем кусок должен быть пропорционального размера? Задавал этот вопрос раньше на этом форуме в рубрике обработка изображений — дали мне хороший пример это кадрирование изображений на маил ру но там для меня уж очень все сложно Буду благодарен за дельный совет или линк почитать. Спасибо заранее
Конкретики дать не могу, но в свое время пользовался http://dynamicdrive.com/ Там даже была игра puzzle сделанная на JS Полистай, а вдруг найдешь что- то.
навскидку - грузим рисунок, яваскрипом запоминаем координаты выделенния, передаем их на сервер. сервак режет исходник по координатам, и возвращает юзеру.
если правильно понял вопрос, то: просто создается <div> которому в бэкграунд ставиться уже загруженная картинка. далее этому <div>'у ставятся требуемые width и height, а background-position назначает смещение видимой области фонового изображения.
Нашол человека который сделал свой движок и всем рассказывает как он работает. Думаю многим пригодится: http://spindrop.us/2006/09/16/cropping- ... d-symfony/
Тоже такую штуку сейчас пишу. Столкнулся с проблемой - возвращает координаты относительно body, а не текущего элемента, хотя на этом элементе и стоит вызов запроса координат. Как понимаю, чтобы высчитать координаты относительно элемента, необходимо найти координаты элемента и вычесть их из возвращаемых координат. Но тут баг - возвращает пустоту (видимо потому, что relative). HTML: <div style="position: relative; z-index: 0; border: 1px solid white;" id="foto_1" onMouseOver="coord.newlayer(1)" onMouseout="coord.destlayer(1)" onMouseMove="coord.move(event, 'drug');"> <img src="clientside/gallery/temp/img.jpg" alt=""> </div> [js] function newlayer(id) { this.parent = document.getElementById("foto_"+id); this.div = document.createElement("div"); this.div.className = "divlayer"; this.div.width = "100px"; this.div.height = "100px"; this.parent.appendChild(this.div); alert(this.parent.parentNode.style.left) //Возвращает пустоту; } function move(e, type) { var e = (!e) ? window.event : e; this.Y = e.pageY || e.y; this.X = e.pageX || e.x; if (type == 'drug') { if (this.fixed == false) { this.setCoordinate(); } } } [/js] В итоге получается, что квадратик бегает на 325 пикселей ниже и 20 левее. Чего делать?