Fortschrittsbalken mit UNIX
Stefan
- javascript
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
[code lang=php]
<?
$fertig=time()+60*10;
$start=time();
mysql_connect("localhost","root","");
mysql_select_db("test");
//ZUM RESET Backslash entfernen
//$fortschritt1=mysql_query("UPDATE fortschritt SET fertig='$fertig', start='$start' WHERE id='1'");exit();
$fortschritt=mysql_query("SELECT * FROM fortschritt WHERE id='1'");
$f=mysql_fetch_array($fortschritt);
?>
<script type="text/javascript">
function fortschritt()
{
var time = document.getElementById('time').innerHTML;
var fertig = <?= $f["fertig"]; ?>;
var jetzt = time;
var ubrigsekunden = 600 - (fertig - jetzt);
var widthvoll = 500;
var nochsekunden1 = fertig - <?= $f["start"]; ?>;
var width1 = widthvoll/nochsekunden1;
var width = ubrigsekunden * width1;
if(width>500)
{
width = 500;
}
document.getElementById('fortschritttext').innerHTML =
'<br><b>Width pro Sekunde</b>:' + width1 +
'<br><b>Vergangengene Sekunden</b>:' + ubrigsekunden +
'<br><b>Sekunden seit START</b>:' + nochsekunden1 +
'<br><b>Width</b>:' + width +
'<br><b>UNIX-JETZT</b>:' + time +
'<br><b>Fertigstellung-NEW</b>:' + <?= (time()+60*10) ?>;
if(width <= widthvoll)
{
document.getElementById('1').width=width;
}
else
{
document.getElementById('1').width=widthvoll;
}
}
function fortschritttest()
{
document.getElementById('fortschritttext1').innerHTML =
'<br><b>UNIX-JETZT</b>:' + <?= time(); ?> +
'<br><b>Fertigstellung-NEW</b>:' + <?= (time()+60*10) ?>;
}
function timestamp () {
var anzSekunden = Math.round(unix());
window.document.getElementById('time').innerHTML = anzSekunden;
window.setTimeout("timestamp()", 1000);
}
function unix () {
var now = new Date();
var time = (now.getTime()) / 1000;
return ((now.getTime()) / 1000);
}
</script>
</head>
<body onload="fortschritt(); fortschritttest(); window.setTimeout('timestamp()', 1000);">
<table border="0" width="500">
<tr>
<td id="fortschritttext">
Fehler!
</td>
</tr>
<tr>
<td >
<Table id="1" border="0" width="500">
<tr>
<td height="25" width="100%" bgcolor="green" id="fortschrittsbalken">
<center>
</center>
</td>
</tr>
</table>
</td>
</tr>
</table>
##########################################################<br>
<table bgcolor="lightblue" width="500" height="100" border="0">
<tr>
<td id="fortschritttext1">
Fehler!
</td>
<td id="time">
</td>
</tr>
</table>
[/code]
Ich würde gerne wissen wie man width der Tabelle (fortschrittsbalken) mittels javascript verändert unswar anhand des UNIX-timestamps. Das heißt die Weite der tabelle soll sich dynamisch zum timestamp verändern.
Mit freundlichen Grüßen,
Stefan