Home > OS >  JavaScript how to change image onclick event
JavaScript how to change image onclick event

Time:10-10

I am trying to make an onclick event in javascript to change the image. This is my HTML code:

    <div class="text-start">
        <img src="images/hamburger.png" alt="" class="hamburger" id="image" onclick="changeImage()">
      </div>

And this is my javascript code:

    function changeImage() {
        if (document.getElementById("image").src == "images/hamburger.png") {
          document.getElementById("image").src = "images/close.png";
        } else {
          document.getElementById("image").src == "images/hamburger.png";
        }
      }

When I click the image nothing happens it is supposed to change the image.

CodePudding user response:

Hello i fixed the javascript for you, hope it works.

function changeImage() {
    var imageEl = document.getElementById("image");
    if (imageEl.getAttribute('src') == "images/hamburger.png") {
      imageEl.src = "images/close.png";
    } else {
      imageEl.src = "images/hamburger.png";
    }
    
    console.log(imageEl.getAttribute('src'))
  }
  • Related