Image Change based on the Value

jayaramgussy · May 11th, 2009, 09:18 AM

Hi All,

Now I am creating a site for system availability.
If system returns 0 then monitor is turned off, If 1 then down, 2 then available based on the values i need to show the images to the end-users. like up image, down image and unavailable image. Please help me to do that one.
Also based on the values the system text-color should changed.
0=black
1=red
2=green.

Thanks in advance.

Dubbs · May 11th, 2009, 09:43 AM

Assuming you can get the value to a variable in JavaScript, you can use something like this.

Code:

function SystemStatus(){
Switch (status)
 status = 0
  status_pic.innerHTML = "<span style='color: #000000'>Monitor 1</span> <img src='images/status_down.png' />"
  break;
 status = 1:
  status_pic.innerHTML = "<span style='color: #FF0000'>Monitor 1</span> <img src='images/status_off.png' />"
  break;
 status=2
  status_pic.innerHTML = "<span style='color: #00FF00'>Monitor 1</span> <img src='images/status_up.png' />"
 break;
}

Then in your HTML, you wil lhave the following.

Code:

<div id="status"> &nbsp;</div>

Then you will need to have update the value of status and the function at the same time, say every 30 seconds.