| |
|
|
| | Моя идея такова: сделать таблицу, состоящую из двух ячеек. Сначала у первой ячейки ширина - 1пиксель. По истечению времени (раз в секунду, например) увелечить ширину этой ячейки на один пиксель.
Я пробовал сделать так:
<html>
<script language="JavaScript">
function add() {
document.getElementById("h").width += 1;
}
var timeout = null;
var t = null;
function lo() {
if (timeout) clearTimeout(timeout);
timeout = setTimeout(add, 1000);
if (t) clearTimeout(t);
timeout = setTimeout(lo, 1000);
}
</script>
<body onload="lo()">
<table border="1" width="300">
<tr><td id="h" width="1"> </td>
<td id="d" width="299"> </td></tr>
</table>
|
Вроде всё работает, только слишком быстро изменяется ширина. За три секунды граница подходит к концу. Как мне сделать так, чтобы изменялось нормально? | |
| |
|
|
| |
|
|
| |
для: Саня
(25.04.2006 в 21:36)
| | | Нельзя брать реальную ширину, потому что она искажается, как видно.
<script>
g=function(i){return document.getElementById(i);}
onload=function add(){
g("h2").innerHTML=g("h").style.width = (parseInt(g("h").style.width)+4)+'px';
g("d2").innerHTML=g("d").style.width = (parseInt(g("d").style.width)-2)+'px';
if(parseInt(g("h").style.width)<999)setTimeout(add,99);
}
</script>
<table border=1 width=300 height=14>
<tr><td bgcolor=darkred id=h style=width:5px></td>
<td bgcolor=lightgrey id=d style=width:295px></td></tr>
</table>
<table border=1 width=300>
<tr><td id=h2 style=width:150px> </td>
<td id=d2 style=width:150px> </td></tr>
</table>
|
Но из-за Оперы, вероятно, придётся перерисовывать таблицу - вся таблица, вставленная как innerHTML, должна нарисоваться в ней правильно.
...
Опера почти нормально заработала, если 5-ю строчку убрать, а ширину style=width:295px не задать вообще. Напряг у неё с уменьшением стиля ширины.
Способ 2.
Сделать полосу прогресса можно, перевернув полосу неудач. | |
| |
|
|
| |
|
|
| |
для: 12345
(25.04.2006 в 23:40)
| | | Да, всё работает. Спасибо. | |
| |
|
|
