4/25/2016

Create Javascript Program to Make a Light Bulb Turn on and Off

Create A HTML Page With JavaScript When We Click The Light Bulb To Turn On/Off The Light.
When We Click A Button JavaScript Change The Image So We Think Bulb Is On Again Click The It Again Change The Image So Bulb Look Like It Is off This Is A Trick Behind Bulb On/off

For This Program You Have To Download Both Image Bulb On And Bulb Off

Here Is A Code

bulb.html


<!DOCTYPE html>
<html>
<body align="center" bgcolor="#686899">
<h1>JavaScript Can Change Images</h1>

<img id="myImage" onclick="changeImage()" src="pic_bulboff.gif" width="100" height="180">

<h2>Click the light bulb to turn on/off the light.</h2>
<script>

function changeImage() {
var image = document.getElementById('myImage');
if (image.src.match("bulbon")) {
image.src = "pic_bulboff.gif";
} else {
image.src = "pic_bulbon.gif";
}
}

</script>
</body >
</html>


Output:-
light bulb off javascript

light bulb on javascript

10 comments:

  1. Thanks Bro Sharing Your Knowledge With us

    ReplyDelete
    Replies
    1. Welcome Reader if any thing you need related to programming plz feel free

      Thanks for visiting

      Delete
  2. Replies
    1. It's 100% Working, Can you please tell me before run this program you download both images Bulb On and Bulb Off. if you Not Please Download first and keep in same folder then Run the Script again.

      Delete
  3. Thanks For sharing this Superb article.I use this Article to show my assignment in college.it is useful For me Great Work. full spectrum led grow light

    ReplyDelete
  4. This comment has been removed by the author.

    ReplyDelete
  5. Hi, I find reading this article a joy. It is extremely helpful and interesting and very much looking forward to reading more of your work.. how-safe-are-christmas-laser-lights

    ReplyDelete
  6. users have already provided positive review about it.
    I have seen best Zerona at my friend’s home, and I think that it is going to be a wonderful idea to present beautiful lamps as gifts for the loved ones.

    ReplyDelete
  7. The most ideal approach to comprehend the advantages of LED lighting is to complete a cost of proprietorship count: figure the power sparing and the expenses maintained a strategic distance from not replacing blown globules over the lifetime of the light (more than 10 years much of the time).Best led christmas lights

    ReplyDelete
  8. This comment has been removed by the author.

    ReplyDelete