Форум программистов [Powered by Invision Power Board]

Версия для печати темы
Нажмите сюда для просмотра этой темы в оригинальном формате

Форум программистов > JavaScript: Общие вопросы > Как узнать координаты относительно окна?

Автор: korob2001 4.4.2006, 08:27

Привет ещё раз!
У меня есть такой DIV:

Код


<td ....>
    <div style="position: relative">
     .....
    </div>
</td>

Подскажите, как узнать его координаты, относительно видимой части браузера? Он примерно у меня находится в следующих координатах left = 20, top = 300. Пробовал получить через стили:

Код


var element = document.getElementById(id);
var x = element.style.left;
var y = element.style.top;
alert("(" + x + ", " + y + ")");

Получаю (0, 0), так как он позиционируется относительно ячейки таблицы. Изменить позиционирование на absolute, не подходит, так как нужно, что бы он постоянно был в ячейке таблицы.

Автор: korob2001 4.4.2006, 08:43

Всё, с этим вопросом разобрался. Вот решение:

Код


var element = document.getElementById(id);
var x = element.offsetLeft;
var y = element.offsetTop;
alert("(" + x + ", " + y + ")");

Автор: 12345c 4.4.2006, 12:31

Неправильное. Так как он в таблице, эти координаты будут относительно таблицы. Правильно - брать в таком цикле:

Код


getPosition=function(o){var y;var x=y=0;
    while(o){x+=o.offsetLeft;y+=o.offsetTop;o=o.offsetParent;}
return[x,y]};

Добавлено @ 12:35
Это относительно документа, а относительно окна браузера - ещё вычесть document.body.scrollHeight , scrollWidth , document.documentElement.scrollHeight, pageYOffset, pageXOffset (в зависимости от браузера).

Автор: korob2001 4.4.2006, 19:25

Спасибо, подправил. smile

Автор: korob2001 4.4.2006, 23:41

Вобщем совместил приятное с полезным. Всё вроде бы как заработало. Единственная проблема сейчас в не верном расчёте при прокручивании колёсика мыши, в NN и FF ;(((( Если чел, в указанных брузерах передвигает скролл бар, то всё нормально работает, но если он крутит колесо мыши, то блок перемещается в не верную позицию. Пример можно глянуть тута:
http://antonium.org/temp/test.html
Что не так?

Автор: 12345c 4.4.2006, 23:46

Я только что делал подобную задачу, оказывалось, что просто окно скроллить не успевает. Вычисляй положение после скролла с маленькой задержкой (20-50 мс).

Автор: korob2001 4.4.2006, 23:51

Хех, так она у меня и так маленькая:

Код


if(!document.all) handleMouseWheel = function(t){setTimeout(checkEvent,10)};

Правда и задержка передвижения тоже 10 миллисекунд.

Автор: korob2001 5.4.2006, 02:08

Всё разобрался, мы про разные задержки говорили. ;))))) Изменил вот эту строку:

Код


function handleMouseWheel(e) { var delay = setTimeout(moveInit,10) };

Которая изначально имела такой вид:

Код


function handleMouseWheel(e) { moveInit };

12345c - ты меня конечно извини, если что не так. Просто я не могу тебе не поставить очередной + smile

Тема хоть и одна, но вопросы были абсолютно разные и ты здорово помог.
Так что, ещё раз спасибо тебе и, очередной, +. ;))))))))