Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 02.07.2009, 09:42
Интересующийся
Отправить личное сообщение для jeel Посмотреть профиль Найти все сообщения от jeel
 
Регистрация: 02.07.2009
Сообщений: 15

обработчик onMouseMove
Помогите модифицировать функцию JavaScript!

В HTML документе есть тег div id = "middle_bg", в него вложен div id = "img".
Img содержит картинку, размеры которой больше middle_bg.
Функция mouseMove - обработчик на OnMouseMove, двигает img внутри middle_bg.
Каким образом можно модифицировать функцию, чтобы при достижении границы middle_bg тегом img, img дальше не двигался, т.е. чтобы не было свободного пространства и угол img не двигался дальше угла middle_bg?

function mouseMove(ev){
ev = ev || window.event;
var mousePos = mouseCoords(ev); //получаем координаты мыши
if(dragObject){
dragObject.style.position = 'relative';
var middle_bg=document.getElementById('middle_bg');
var middle_bg_coords = getPosition(middle_bg);
var img=document.getElementById('img');
var img_coords = getPosition(img);
dragObject.style.top = mousePos.y - mouseOffset.y - middle_bg_coords.y;
dragObject.style.left = mousePos.x - mouseOffset.x - middle_bg_coords.x;
return false;
}
}
Ответить с цитированием
  #2 (permalink)  
Старый 02.07.2009, 09:55
Интересующийся
Отправить личное сообщение для jeel Посмотреть профиль Найти все сообщения от jeel
 
Регистрация: 02.07.2009
Сообщений: 15

Если строчку
dragObject.style.top = mousePos.y - mouseOffset.y - middle_bg_coords.y;
заменить например таким
if (map_coords.y <= middle_bg_coords.y)
{
dragObject.style.top = mousePos.y - mouseOffset.y - middle_bg_coords.y;
}
то если сначала двигать картинку вверх, а затем вниз, то она останавливается у верхнего края, однако дальнейшие попытки сдвинуть картинку вверх остаются безрезультатными, и картинка как бы прилипает к верхнему краю и вверх не передвигается

Помогите, пожалуйста, исправить код...
Ответить с цитированием
  #3 (permalink)  
Старый 02.07.2009, 09:59
Аватар для B~Vladi
Модератор Всея Форума
Отправить личное сообщение для B~Vladi Посмотреть профиль Найти все сообщения от B~Vladi
 
Регистрация: 14.05.2009
Сообщений: 4,022

if (map_coords.y < middle_bg_coords.y)
Ответить с цитированием
  #4 (permalink)  
Старый 02.07.2009, 10:02
Интересующийся
Отправить личное сообщение для jeel Посмотреть профиль Найти все сообщения от jeel
 
Регистрация: 02.07.2009
Сообщений: 15

такой вариант работает только для первого раза...затем картинка как-бы прилипает к верхней границе и повертикали не двигается...в чем может быть дело?
Ответить с цитированием
  #5 (permalink)  
Старый 02.07.2009, 10:04
Аватар для B~Vladi
Модератор Всея Форума
Отправить личное сообщение для B~Vladi Посмотреть профиль Найти все сообщения от B~Vladi
 
Регистрация: 14.05.2009
Сообщений: 4,022

Проверяешь если y<0, ставишь её в 0. Т.е. нада возвращать её туда, где проверка будет давать false, чтобы можно было таскать.
Ответить с цитированием
  #6 (permalink)  
Старый 02.07.2009, 10:07
Аватар для B~Vladi
Модератор Всея Форума
Отправить личное сообщение для B~Vladi Посмотреть профиль Найти все сообщения от B~Vladi
 
Регистрация: 14.05.2009
Сообщений: 4,022

ах, да... Забыл кое-что.
Алгоритм, значт, такой:
1. Присваиваем новое значение.
2. Проверяем, не вышла ли картинка за пределы
3. Если вышла - возвращаем назад.
Ответить с цитированием
  #7 (permalink)  
Старый 02.07.2009, 10:54
Интересующийся
Отправить личное сообщение для jeel Посмотреть профиль Найти все сообщения от jeel
 
Регистрация: 02.07.2009
Сообщений: 15

if (map_coords.y <= middle_bg_coords.y)
{
dragObject.style.top = mousePos.y - mouseOffset.y - middle_bg_coords.y;
}
else
{
dragObject.style.top = 0;
}

При таком коде при движении мышью картинка дрожит, т.е. как бы пытается вернуться к верхнему краю...
Если отпускаю кнопку мыши, она иногда притягивается к верхнему краю, иногда нет ... от чего это зависит не пойму
Ответить с цитированием
  #8 (permalink)  
Старый 02.07.2009, 11:00
Интересующийся
Отправить личное сообщение для jeel Посмотреть профиль Найти все сообщения от jeel
 
Регистрация: 02.07.2009
Сообщений: 15

if (map_coords.y <= middle_bg_coords.y)
{
dragObject.style.top = mousePos.y - mouseOffset.y - middle_bg_coords.y;
}
else
{
dragObject.style.top = 0;
dragObject = null;
}

при таком варианте (когда обнуляю dragObject) работает нормально, однако чтобы передвигать в другую сторону приходится заново цеплять мышкой...
не можете подсказать рациональное решение как от этого избавиться?
Ответить с цитированием
  #9 (permalink)  
Старый 02.07.2009, 12:47
Аватар для B~Vladi
Модератор Всея Форума
Отправить личное сообщение для B~Vladi Посмотреть профиль Найти все сообщения от B~Vladi
 
Регистрация: 14.05.2009
Сообщений: 4,022

Ты не методом тыка делай, а умом.
Допустим ты двигаешь элемент по Y вверх. Тебе нада чтобы он не заходил выше нуля. Когда происходит событие, сначала присваиваешь новые значения. К примеру новое значение -10. После этого Делаешь проверку. В ней проверяешь - если твой объект находится там, где он НЕ должен быть, только тогда отправляешь его туда, где находится граница возможного расположения объекта, т.е. 0. Делать проверку вида y<=0 неправильно, т.к. 0 находится в области, в которой объект МОЖЕТ быть. Для понимания сего ты должет чётко представлять это в голове.
Ответить с цитированием
  #10 (permalink)  
Старый 02.07.2009, 12:51
Интересующийся
Отправить личное сообщение для jeel Посмотреть профиль Найти все сообщения от jeel
 
Регистрация: 02.07.2009
Сообщений: 15

а каким образом отрабатывает обработчик события mousemove? при каждом перемещении мыши хотя бы на пиксель или после прекрашения движения?
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Назначить на обработчик события метод обьекта Logo Общие вопросы Javascript 11 20.06.2009 22:40
Как скрыть обработчик HTML-формы с помошью JavaScript? Мишаня Общие вопросы Javascript 5 15.06.2009 04:40
Обработчик события: как делает jquery? Shasoft jQuery 35 22.04.2009 08:41
отправка файла через обработчик события submit starrich AJAX и COMET 2 13.08.2008 21:29
обработчик собития onMouseOver для фрейма Rian Events/DOM/Window 7 06.06.2008 18:48