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

Поиск:

Ответ в темуСоздание новой темы Создание опроса
> Расположение дива. 
V
    Опции темы
Innuendo
Дата 14.2.2006, 19:01 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Опытный
**


Профиль
Группа: Участник
Сообщений: 745
Регистрация: 24.12.2005
Где: Молдова

Репутация: 2
Всего: 6



При нажатии на кнопку, должно появится окошечко (див) по центру экрана.
*Пометка: данный код для FireFox*
Я его центрую, и хочу высветить, но когда див ещё не высвечен, то его координаты не меняются.. То есть получается, я сначала его показываю, а потом двигаю.. и вот это движение, как раз то и видно (как он с края экрана в центр быстро двинулся):
Код

var ourDiv = document.getElementById(id);
ourDiv.style.display="";
var width= ourDiv.offsetWidth;
var height = ourDiv.offsetHeight;
var left = parseInt((innerWidth/2) - (width/2));
var top = parseInt((innerHeight/2) - (height/2));
ourDiv.style.left = left;
ourDiv.style.top = top;

это фрагмент кода.

Как сделать, чтоб он сначала его расположил, а потом показал?


--------------------
=)
PM MAIL ICQ Jabber   Вверх
12345c
Дата 14.2.2006, 19:10 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Круглый
****


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

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



Да, такое наблюдается.

setTimeout('ourDiv.style.display="";',99);


--------------------
Google Code Playground - онлайн-отладка своих примеров HTML+JS без регистрации, с сохранением по URL, без кириллицы. Go
PM WWW   Вверх
Innuendo
Дата 14.2.2006, 20:04 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Опытный
**


Профиль
Группа: Участник
Сообщений: 745
Регистрация: 24.12.2005
Где: Молдова

Репутация: 2
Всего: 6



а я вот не много не понимаю...
что это даст?
то есть изменит размеры, и после 99 милисекунд только покажет? а почему оно будет работать? а то нет smile

и я вот всё не могу найти различие в setInterval и setTimeout


--------------------
=)
PM MAIL ICQ Jabber   Вверх
Alx
Дата 14.2.2006, 21:42 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Ajaxy
****


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

Репутация: 10
Всего: 78



Innuendo,
Как я понимаю, Мозилла не работает с объектами, у которых display:none;. Даже с нульфреймами из-за этого глюки.
советую использовать visibility:hidden;, тем более, что див абсолютно позиционированный и на расположение элементов на странице это не повлияет.
так же можешь попробывать height и width = 0.

что касается setTimeout() и setInterval(), то различаются они тем, что setTimeout("{expression}",{time}) создаёт паузу на время в {time} миллисекунд, после которой выполняется {expression}.

var interval = setInterval("{expression}",{time}) создает счетчик, который выполняет одно и то же {expression} через каждые {time} миллисекунд и возвращает свой идентификатор, с помощью которого его можно будет удалить через метод clearInterval({interval})

вот те какой красивый пример сделал smile
открой через IE ;)

Код

<script>
interval = false;

function whats_interval()
{    if (window.interval)
    {    clearInterval(window.interval);
        document.getElementById("but").value = " старт "; window.interval = false;
    }
    else
    {    window.interval = setInterval("document.body.innerHTML+='&nbsp;[B]&[/B]#9788; &nbsp;'",500);
        document.getElementById("but").value = " стоп ";
    }
}
</script>
<body text="yellow" bgcolor="99ccff" style="font-size:30px;">
<input type="button" onclick="whats_interval()" value=" старт " id="but">
<br><br><br><br>
</body>


Это сообщение отредактировал(а) Alx - 14.2.2006, 22:15


--------------------
PM MAIL WWW ICQ   Вверх
Innuendo
Дата 14.2.2006, 22:05 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Опытный
**


Профиль
Группа: Участник
Сообщений: 745
Регистрация: 24.12.2005
Где: Молдова

Репутация: 2
Всего: 6



Alx, забавно
то есть если у дива position:absolute, то visibility:hidden не влияет на располжение других элементов?
просто я никому z-index не ставил...


--------------------
=)
PM MAIL ICQ Jabber   Вверх
Alx
Дата 14.2.2006, 22:17 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Ajaxy
****


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

Репутация: 10
Всего: 78



нет, каэшн) а z-index и не надо)

балин, парсеср кривит smile
чтобы мой скрипт заработал с солнышками, вот так напиши:

window.interval = setInterval("document.body.innerHTML+='&nbsp;& #9788; &nbsp;'",500);

тока пробел убери перел #9788, тогда красиво буит, я старался smile


--------------------
PM MAIL WWW ICQ   Вверх
Innuendo
Дата 14.2.2006, 22:34 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Опытный
**


Профиль
Группа: Участник
Сообщений: 745
Регистрация: 24.12.2005
Где: Молдова

Репутация: 2
Всего: 6



гы smile солнышки рулят smile

+ всем плюсы за помощь smile

Это сообщение отредактировал(а) Innuendo - 14.2.2006, 22:36


--------------------
=)
PM MAIL ICQ Jabber   Вверх
12345c
Дата 15.2.2006, 02:51 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Круглый
****


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

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



Цитата(Innuendo @ 14.2.2006, 20:04 Найти цитируемый пост)
а я вот не много не понимаю...
что это даст?
то есть изменит размеры, и после 99 милисекунд только покажет?

Да. СМысл самый очевидный - если с корректным показом есть глюки - делаем показ позже.

Такие нестыковки в событиях - естественное дело для такой сложной системы как DOM. Все браузеры в эволюции проходят через такие мелкие нестыковки, которые надо подчищать техническими задержками. С IE5.0 и onload такое наблюдалось, а прорисовка большой картинки до сих пор запаздывает после её генерации на 0.5-1 с. Года через 2, вот увидишь, эта задержка в FF не понадобится smile


--------------------
Google Code Playground - онлайн-отладка своих примеров HTML+JS без регистрации, с сохранением по URL, без кириллицы. Go
PM WWW   Вверх
Sardar
Дата 15.2.2006, 12:35 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Бегун
****


Профиль
Группа: Модератор
Сообщений: 6986
Регистрация: 19.4.2002
Где: Нидерланды, Groni ngen

Репутация: 78
Всего: 317



Парни, что то вы мудрите, никто не подумал поставить style.display=... после сдвигания элемента? Как только display станет отличным от none элемент встанет в отрисовку, понадобяться все другие стили, что к этому моменту уже установлены.


--------------------
 Опыт - сын ошибок трудных  © А. С. Пушкин
 Процесс написания своего велосипеда повышает профессиональный уровень программиста. © Opik
 Оценить мои качества можно тут.
PM   Вверх
12345c
Дата 15.2.2006, 14:20 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Круглый
****


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

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



Sardar, я подобное делал в "падающем снеге", там "после" не помогло в FF, понадобилась такая же задержка.


--------------------
Google Code Playground - онлайн-отладка своих примеров HTML+JS без регистрации, с сохранением по URL, без кириллицы. Go
PM WWW   Вверх
Innuendo
Дата 15.2.2006, 14:57 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Опытный
**


Профиль
Группа: Участник
Сообщений: 745
Регистрация: 24.12.2005
Где: Молдова

Репутация: 2
Всего: 6



Sardar, конечно пробовал smile только вот в том-то и проблема.. что у ФФ незя изменять координаты, если style.display равно none


--------------------
=)
PM MAIL ICQ Jabber   Вверх
Sardar
Дата 15.2.2006, 15:26 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Бегун
****


Профиль
Группа: Модератор
Сообщений: 6986
Регистрация: 19.4.2002
Где: Нидерланды, Groni ngen

Репутация: 78
Всего: 317



Цитата(Innuendo @ 15.2.2006, 13:57 Найти цитируемый пост)
что у ФФ незя изменять координаты, если style.display равно none

В смысле нельзя? Да изменения будут не видны, т.к. слой выкинут из отрисовки. В чём проявляться проблема?


--------------------
 Опыт - сын ошибок трудных  © А. С. Пушкин
 Процесс написания своего велосипеда повышает профессиональный уровень программиста. © Opik
 Оценить мои качества можно тут.
PM   Вверх
Innuendo
Дата 15.2.2006, 17:36 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Опытный
**


Профиль
Группа: Участник
Сообщений: 745
Регистрация: 24.12.2005
Где: Молдова

Репутация: 2
Всего: 6



Sardar,
ну так вот.. я задаю top и left по центру, а потом показываю.. а он изменение top и left не проделает...
он их может проделать только после того, как display= ""


--------------------
=)
PM MAIL ICQ Jabber   Вверх
Sardar
Дата 15.2.2006, 18:18 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Бегун
****


Профиль
Группа: Модератор
Сообщений: 6986
Регистрация: 19.4.2002
Где: Нидерланды, Groni ngen

Репутация: 78
Всего: 317



Цитата(Innuendo @ 15.2.2006, 16:36 Найти цитируемый пост)
а он изменение top и left не проделает...

Млин ну не мальенкий же, уже долго на форуме, а траблу пояснить не можешь smile
Как понять не работает? По идее вообще слой под мозиллой сдвигаться не должен, т.к. left|top ты указываешь просто число без спецификации едениц, добавь + 'px', поставь display="block" последней строчкой, запусти smile


--------------------
 Опыт - сын ошибок трудных  © А. С. Пушкин
 Процесс написания своего велосипеда повышает профессиональный уровень программиста. © Opik
 Оценить мои качества можно тут.
PM   Вверх
Alx
Дата 15.2.2006, 19:22 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Ajaxy
****


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

Репутация: 10
Всего: 78



Код

var ourDiv = document.getElementById(obj_id);
var _width= ourDiv.style.width;
var _height = ourDiv.style.height;
var _left = parseInt((screen.width/2) - (_width/2));
var _top = parseInt((screen.height/2) - (_height/2));
ourDiv.style.left = _left + 'px';
ourDiv.style.top = _top + 'px';
ourDiv.style.display="block";


так работает...
offset(Height|Width) перед отображением юзать нельзя, т.к. они равняются "0".

M
Sardar
Добавил +'px', серьёзно, мозилла не будет хавать значения если не указаны еденицы (px, em, ex, pt и т.д.)
Это что бы не было дальше вопросов "по кругу" =)


Это сообщение отредактировал(а) Sardar - 15.2.2006, 20:26


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


 




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


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

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