[removed] Rotate img on click

后端 未结 2 1584
轻奢々
轻奢々 2021-01-23 13:22

I\'m trying to make the img with the id image rotate using the onclick event handler to use the code in my function which grabs the image by ID assigns a variable name, then use

相关标签:
2条回答
  • 2021-01-23 13:34

    You can do the rotation itself using CSS:

    .rotated-image {
      -webkit-transform: rotate(20deg);
              transform: rotate(20deg);
    }
    

    On the html:

    <section id="middle">
        <img id="image" src="images/flower.png" >   
        <button onclick="myFunction()">Click me</button>
    </section>
    

    And then, on the javascript, just add the class:

    function myFunction() {
      var img = document.getElementById("image");
      img.setAttribute("class", "rotated-image");
    }
    

    Check out the result: http://jsbin.com/ibEmUFI/2/edit

    0 讨论(0)
  • 2021-01-23 13:50

    try to use div with id as a selector:

    <div id='image'><img src="images/flower.png" /></div>
    
     and 
    
    var img = document.getElementById("image").getElementsByTagName('img');
    

    worth a try!

    0 讨论(0)
提交回复
热议问题