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

Поиск:

Ответ в темуСоздание новой темы Создание опроса
> свойства-призраки (css), получить, не заданное явно, свойство 
:(
    Опции темы
artsb
Дата 29.6.2009, 21:28 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Эксперт
****


Профиль
Группа: Завсегдатай
Сообщений: 2280
Регистрация: 17.7.2007
Где: центр Вселенной

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



Всем привет!

Если объекту, например div'у, не задать явно ширину. То такой код:
Код

alert(e.style.width); // e - это div

покажет пустое окно. Такая же проблема с другими свойствами. Вопрос в том, как получить это свойство.


--------------------
Чем отличается умный человек от мудрого?
Умный - выпутается из любой ситуации.
Мудрый - просто в неё не попадёт.
PM MAIL   Вверх
Soah
Дата 29.6.2009, 21:57 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Опытный
**


Профиль
Группа: Участник
Сообщений: 512
Регистрация: 18.2.2009

Репутация: 13
Всего: 54



Код

alert(e.clientWidth);
alert(e.offsetWidth);

PM MAIL   Вверх
artsb
Дата 29.6.2009, 22:02 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Эксперт
****


Профиль
Группа: Завсегдатай
Сообщений: 2280
Регистрация: 17.7.2007
Где: центр Вселенной

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



Soah, спасибо! ;)
А как быть с e.style.right?

Кстати, а чем они отличаются? Результат один и тот же...

Это сообщение отредактировал(а) artsb - 29.6.2009, 22:03


--------------------
Чем отличается умный человек от мудрого?
Умный - выпутается из любой ситуации.
Мудрый - просто в неё не попадёт.
PM MAIL   Вверх
bars80080
Дата 29.6.2009, 22:17 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


прапор творюет
****
Награды: 1



Профиль
Группа: Завсегдатай
Сообщений: 12022
Регистрация: 5.12.2007
Где: Königsberg

Репутация: 44
Всего: 315



это совсем не одно и тоже. clientWidth - дословно означает команду обмерять ширину элемента. а .style.width - посмотреть, что записано в стиле элемента (причём не в css-таблице, а в её аналоге javascript). значение в style.width появится только после присвоения этому свойству значения через javascript
PM MAIL WWW   Вверх
Soah
Дата 29.6.2009, 22:23 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Опытный
**


Профиль
Группа: Участник
Сообщений: 512
Регистрация: 18.2.2009

Репутация: 13
Всего: 54



Цитата(artsb @  29.6.2009,  22:02 Найти цитируемый пост)
Кстати, а чем они отличаются? Результат один и тот же...

посмотри clientWidth, clientHeight, clientLeft, clientTop/offsetHeight, offsetWidth, offsetLeft, offsetTop

Добавлено через 9 минут и 13 секунд
Цитата(bars80080 @  29.6.2009,  22:17 Найти цитируемый пост)
 значение в style.width появится только после присвоения этому свойству значения через javascript

Код

<script type="text/javascript">
    window.onload = function() {
        alert(document.getElementById('hh').style.width);
    }
</script>
    
<div id='hh' style="width:200px;">&nbsp;</div>


Это сообщение отредактировал(а) Soah - 29.6.2009, 22:24
PM MAIL   Вверх
bars80080
Дата 29.6.2009, 22:40 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


прапор творюет
****
Награды: 1



Профиль
Группа: Завсегдатай
Сообщений: 12022
Регистрация: 5.12.2007
Где: Königsberg

Репутация: 44
Всего: 315



хм, упустил. не пользовался таким страхом  style="width:200px;" не помню с когда
PM MAIL WWW   Вверх
artsb
Дата 29.6.2009, 22:45 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Эксперт
****


Профиль
Группа: Завсегдатай
Сообщений: 2280
Регистрация: 17.7.2007
Где: центр Вселенной

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



Цитата(bars80080 @  29.6.2009,  22:17 Найти цитируемый пост)
только после присвоения

Хотелось бы узнать, что браузер присвоил... А не что я задам.

У меня, вообще, такая ерунда. есть большой div. В нём куча картинок. При наведении на одну из них, нужно затемнить весь div и поверх него в том же месте, где находится картинка, на которую навели курсор, показать div с этой же картинкой и дополнительной инфой (в ней есть ссылки).

Я сделал так. 
Один div (затемнение)
Код

position: absolute;
display: none;
padding: 0px;
margin: 0px;
background: url('./imgs/shadow.png') repeat bottom right !important;
z-index: 100;

В нём другой div (доп. инфа.)
Код

position: relative;
padding: 0px;
margin: 0px;

В этом диве таблица, в которой находится картинка и описание.
С помощью e.clientWidth и e.clientHeight растянул див с затемнением. Всё ОК.
Пытаюсь разместить второй див над картинкой:
Код

mr_cnt.style.left  = e.offsetLeft + "px";
mr_cnt.style.top   = e.offsetTop  + "px";

Но он оказывается значительно правее и ниже...

Ещё мне нужно узнать положение правого края дива со всеми картинками.


--------------------
Чем отличается умный человек от мудрого?
Умный - выпутается из любой ситуации.
Мудрый - просто в неё не попадёт.
PM MAIL   Вверх
Soah
Дата 29.6.2009, 23:04 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Опытный
**


Профиль
Группа: Участник
Сообщений: 512
Регистрация: 18.2.2009

Репутация: 13
Всего: 54



PM MAIL   Вверх
artsb
Дата 29.6.2009, 23:26 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Эксперт
****


Профиль
Группа: Завсегдатай
Сообщений: 2280
Регистрация: 17.7.2007
Где: центр Вселенной

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



Soah, спс. С этим разобрался. Хотя наверное придётся вернуть, когда буду затачивать под IE. Теперь остался вопрос с правым краем.


--------------------
Чем отличается умный человек от мудрого?
Умный - выпутается из любой ситуации.
Мудрый - просто в неё не попадёт.
PM MAIL   Вверх
Samotnik
Дата 30.6.2009, 11:08 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Super star !
****


Профиль
Группа: Awaiting Authorisation
Сообщений: 7192
Регистрация: 4.11.2006
Где: Минск City

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



Код

<script type="text/javascript">
//IE5+, Mozilla 1.0+, Opera 7+

function getClientWidth()
{
  return document.compatMode=='CSS1Compat' && !window.opera?document.documentElement.clientWidth:document.body.clientWidth;
}

function getClientHeight()
{
  return document.compatMode=='CSS1Compat' && !window.opera?document.documentElement.clientHeight:document.body.clientHeight;
}

</script>

PM MAIL   Вверх
artsb
Дата 30.6.2009, 11:15 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Эксперт
****


Профиль
Группа: Завсегдатай
Сообщений: 2280
Регистрация: 17.7.2007
Где: центр Вселенной

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



Samotnik, спасибо! Это ширина и высота всего документа, как я понял?


--------------------
Чем отличается умный человек от мудрого?
Умный - выпутается из любой ситуации.
Мудрый - просто в неё не попадёт.
PM MAIL   Вверх
Samotnik
Дата 30.6.2009, 11:21 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Super star !
****


Профиль
Группа: Awaiting Authorisation
Сообщений: 7192
Регистрация: 4.11.2006
Где: Минск City

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



Цитата(artsb @  30.6.2009,  11:15 Найти цитируемый пост)
Это ширина и высота всего документа, как я понял? 

потестируй  smile 
PM MAIL   Вверх
artsb
Дата 30.6.2009, 15:16 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Эксперт
****


Профиль
Группа: Завсегдатай
Сообщений: 2280
Регистрация: 17.7.2007
Где: центр Вселенной

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



Цитата(Samotnik @  30.6.2009,  11:21 Найти цитируемый пост)
потестируй

Ну да. Возвращает размеры клиентской области окна.


--------------------
Чем отличается умный человек от мудрого?
Умный - выпутается из любой ситуации.
Мудрый - просто в неё не попадёт.
PM MAIL   Вверх
artsb
Дата 30.6.2009, 16:34 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Эксперт
****


Профиль
Группа: Завсегдатай
Сообщений: 2280
Регистрация: 17.7.2007
Где: центр Вселенной

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



Получаю левый верхний угол объекта так:
Код

while(tmp) {
x += tmp.offsetLeft;
y += tmp.offsetTop;
tmp = tmp.offsetParent;
}

Потом можно прибавить ширину и высоту и получить правый нижний угол:
Код

r = x + e.clientWidth;
b = y + e.clientHeight;

Это работает с "родными" объектами. А вот с динамическими никак... clientWidth и clientHeight всегда равны 0. Пробовал так же offsetWidth и offsetHeight.


Ещё раз повторю, что нужно получить координаты правого нижнего угла объекта.

Это сообщение отредактировал(а) artsb - 30.6.2009, 16:51


--------------------
Чем отличается умный человек от мудрого?
Умный - выпутается из любой ситуации.
Мудрый - просто в неё не попадёт.
PM MAIL   Вверх
Soah
Дата 30.6.2009, 17:01 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Опытный
**


Профиль
Группа: Участник
Сообщений: 512
Регистрация: 18.2.2009

Репутация: 13
Всего: 54



Цитата(artsb @  30.6.2009,  16:34 Найти цитируемый пост)
А вот с динамическими никак... clientWidth и clientHeight всегда равны 0. Пробовал так же offsetWidth и offsetHeight.

покажи как создаёшь динамически smile 
PM MAIL   Вверх
Ответ в темуСоздание новой темы Создание опроса
0 Пользователей читают эту тему (0 Гостей и 0 Скрытых Пользователей)
0 Пользователей:
« Предыдущая тема | JavaScript: для новичков | Следующая тема »


 




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


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

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