Модераторы: Sardar, Aliance
  

Поиск:

Ответ в темуСоздание новой темы Создание опроса
> Как узнать координаты относительно окна? Элемент позиционируется относительн 
:(
    Опции темы
korob2001
Дата 4.4.2006, 08:27 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Эксперт
****


Профиль
Группа: Комодератор
Сообщений: 2871
Регистрация: 29.12.2002

Репутация: нет
Всего: 61



Привет ещё раз!
У меня есть такой 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, не подходит, так как нужно, что бы он постоянно был в ячейке таблицы.


--------------------
"Время проходит", - привыкли говорить вы по неверному пониманию. 
"Время стоит - проходите вы".
PM MAIL WWW ICQ MSN   Вверх
korob2001
Дата 4.4.2006, 08:43 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Эксперт
****


Профиль
Группа: Комодератор
Сообщений: 2871
Регистрация: 29.12.2002

Репутация: нет
Всего: 61



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

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



--------------------
"Время проходит", - привыкли говорить вы по неверному пониманию. 
"Время стоит - проходите вы".
PM MAIL WWW ICQ MSN   Вверх
12345c
Дата 4.4.2006, 12:31 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Круглый
****


Профиль
Группа: Vingrad developer
Сообщений: 2018
Регистрация: 26.12.2005
Где: наша не пропадала ?

Репутация: 57
Всего: 101



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

Код

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 (в зависимости от браузера). 

Это сообщение отредактировал(а) 12345c - 15.8.2006, 14:15
PM WWW   Вверх
korob2001
Дата 4.4.2006, 19:25 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Эксперт
****


Профиль
Группа: Комодератор
Сообщений: 2871
Регистрация: 29.12.2002

Репутация: нет
Всего: 61



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


--------------------
"Время проходит", - привыкли говорить вы по неверному пониманию. 
"Время стоит - проходите вы".
PM MAIL WWW ICQ MSN   Вверх
korob2001
Дата 4.4.2006, 23:41 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Эксперт
****


Профиль
Группа: Комодератор
Сообщений: 2871
Регистрация: 29.12.2002

Репутация: нет
Всего: 61



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

Это сообщение отредактировал(а) korob2001 - 4.4.2006, 23:41


--------------------
"Время проходит", - привыкли говорить вы по неверному пониманию. 
"Время стоит - проходите вы".
PM MAIL WWW ICQ MSN   Вверх
12345c
Дата 4.4.2006, 23:46 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Круглый
****


Профиль
Группа: Vingrad developer
Сообщений: 2018
Регистрация: 26.12.2005
Где: наша не пропадала ?

Репутация: 57
Всего: 101



Я только что делал подобную задачу, оказывалось, что просто окно скроллить не успевает. Вычисляй положение после скролла с маленькой задержкой (20-50 мс).
PM WWW   Вверх
korob2001
Дата 4.4.2006, 23:51 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Эксперт
****


Профиль
Группа: Комодератор
Сообщений: 2871
Регистрация: 29.12.2002

Репутация: нет
Всего: 61



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

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

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

Это сообщение отредактировал(а) korob2001 - 4.4.2006, 23:52


--------------------
"Время проходит", - привыкли говорить вы по неверному пониманию. 
"Время стоит - проходите вы".
PM MAIL WWW ICQ MSN   Вверх
korob2001
Дата 5.4.2006, 02:08 (ссылка) |    (голосов:1) Загрузка ... Загрузка ... Быстрая цитата Цитата


Эксперт
****


Профиль
Группа: Комодератор
Сообщений: 2871
Регистрация: 29.12.2002

Репутация: нет
Всего: 61



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

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

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

function handleMouseWheel(e) { moveInit };


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


--------------------
"Время проходит", - привыкли говорить вы по неверному пониманию. 
"Время стоит - проходите вы".
PM MAIL WWW ICQ MSN   Вверх
  
Ответ в темуСоздание новой темы Создание опроса
Форум для вопросов, которые имеются в справочниках, но их поиск вызвал затруднения, или для разработчика требуется совет или просьба отыскать ошибку. Напоминаем: 1) чётко формулируйте вопрос, 2) приведите пример того, что уже сделано, 3) укажите явно, нужен работающий пример или подсказка о том, где найти информацию.
 
0 Пользователей читают эту тему (0 Гостей и 0 Скрытых Пользователей)
0 Пользователей:
« Предыдущая тема | JavaScript: Общие вопросы | Следующая тема »


 




[ Время генерации скрипта: 0.0926 ]   [ Использовано запросов: 22 ]   [ GZIP включён ]


Реклама на сайте     Информационное спонсорство

 
По вопросам размещения рекламы пишите на vladimir(sobaka)vingrad.ru
Отказ от ответственности     Powered by Invision Power Board(R) 1.3 © 2003  IPS, Inc.