|
|
|
новичок
участник
Last Login: 29.12.2006 13:12
Сообщ.: 5,
Visits: 15
|
|
Здравствуйте!
Есть таблица результатов. Кликаю по столбцу - выполняется сортировка всей таблицы. В этом момент мне нужно что-то писать юзеру. Хочу сделать див с инфой, чтобы он появлялся сразу после клика по столбцу таблицы и исчезал по окончании сортировки.
Я создаю его:
function ShowInfoDiv()
{
document.writeln("<div id='infoDiv' style='...'>Идет сортировка..</div>");
}
// скрытие дива
function HideInfoDiv()
{
getElementById('infoDiv').style.display = 'none';
}
Но эта функция затирает все содержимое.
Подскажите, пожалуйста, как мне сделать, чтобы этот див появлялся поверх всего содержимого?
Спасибо.P.S. Дело в том, что его нужно создавать именно JavaScript'ом, а не делать его невидимым, а потом визуализировать.
|
|
|
|
|
Supreme Being
модератор
Last Login: 04.05.2008 13:32
Сообщ.: 7 240,
Visits: 65 445
|
|
Через методы DOM надо работать:function ShowInfoDiv()
{
var oDiv = document.createElement("DIV");
oDiv.id = "infoDiv";
var oText = document.createTextNode("Идет сортировка");
oDiv.appendChild(oText);
document.body.appendChild(oDiv);
} Стиль для такого DIVa может быть например таким: #infoDiv {position:absolute; left:0; top:0; width:100%; height:100%; background:black; color:white; z-index:10}
|
|
|
|
|
новичок
участник
Last Login: 29.12.2006 13:12
Сообщ.: 5,
Visits: 15
|
|
Хорошо.
У вас все работает на простом примере - у меня тоже.
А теперь реальная ситуация.[code=javascript]
function sortColumn(e)
{
ShowInfoDiv();
LetSort();
HideInfoDiv(); // никаких задержек!! - нафиг они мне нужны
} function LetSort() // заглушка реальной сортировки
{
var res;
for(var i=0; i<1000000; i++)
for(var j=i; j<1000000; j++)
res += i*i*i/(j*j);
} function ShowInfoDiv()
{
if(document.all['infoDiv'])
{
document.getElementById('infoDiv').style.display = '';
return;
}
var divWidth = 200;
var divHeight = 22;
var left = parseInt((document.body.clientWidth - divWidth) / 2)-10;
var top = parseInt((document.body.clientHeight - divHeight) / 2)-10;
elDiv = document.createElement('div');
elDiv.innerHTML = "<div id='infoDiv' style='left:"+left+"; top:"+top+"; position:absolute; display:block;"+
" background:#778899; color:White; font-size:larger; text-align:center; width:" +divWidth+ "; height:" +divHeight+ ";'>Процесс сортировки...</div>";
document.body.appendChild(elDiv);
}
function HideInfoDiv()
{
document.getElementById('infoDiv').style.display = 'none';
}
[/code] Дальше идет просто таблица с кучей записей:
[code=html]
<body>
<table onclick="sortColumn(event);">
.....
</table>
</body>
[/code] Так вот. Дело все в том, что этот div появляется только после того, как закончена сортировка. А мне-то надо, чтобы он появлялся ДО нее!
Вот в чем проблема-то.
|
|
|
|
|
Supreme Being
модератор
Last Login: 04.05.2008 13:32
Сообщ.: 7 240,
Visits: 65 445
|
|
Пока идет выполнение скрипта браузер не будет обновлять экран. Поэтому придется использовать таймер:function sortColumn(e)
{
ShowInfoDiv();
setTimeout("LetSort(); HideInfoDiv()", 100);
} Еще я бы избавился от обращения к document.all в функции ShowInfoDiv. Эта коллекция работает только в MSIE/Opera и вообще про нее давно пора уже забыть т.к. анлогичные вещи реализованы в DOM (ее поддерживают все современные браузеры). function ShowInfoDiv()
{
var infoDiv = document.getElementById('infoDiv');
if(null != infoDiv)
{
infoDiv.style.display = 'block';
return;
}
...
}
|
|
|
|
|
новичок
участник
Last Login: 29.12.2006 13:12
Сообщ.: 5,
Visits: 15
|
|
| Спасибо, блин, большое! Чтоб я без Вас делал?!! А то я тут весь извелся - не кажет и все тут! Мда. Век живи - век учись, и дураком помрешь. Однако, JS - очень нетривиальный язык! :)
|
|
|
|
|
новичок
участник
Last Login: 29.12.2006 13:12
Сообщ.: 5,
Visits: 15
|
|
| слушай, а почему когда ставлю задержку 1, а не 100, у меня первый раз div не появляется, только после 2-го раза?
|
|
|
|
|
Supreme Being
модератор
Last Login: 04.05.2008 13:32
Сообщ.: 7 240,
Visits: 65 445
|
|
| Видимо браузер не успевает за такой короткий интервал обновить экран.
|
|
|
|
|
Supreme Being
модератор
Last Login: 04.05.2008 13:32
Сообщ.: 7 240,
Visits: 65 445
|
|
| Я имею в виду то, что создание нового DIVa (что делается в первый раз) требует больше времени чем переключение его видимости (что делается во второй).
|
|
|
|
|
новичок
участник
Last Login: 29.12.2006 13:12
Сообщ.: 5,
Visits: 15
|
|
| ну да, я понял. Просто как мне подобрать такую задержку, чтобы на всех пользовательских компах в первый раз браузер успевал создать и отобразить div? А ставить большую, тоже, сам понимаешь, не очень хочется.
|
|
| |