javascript - Jquery rotation rotate img on click -
good evening. @ moment using jquery rotate plugin allow image rotate clicked, image rotates 180 degrees once button clicked again go original position image keep 180 degrees rotation , can't figure out way of putting 0 degree position. can help? here code:
html:
<div class="box_one"> <div class="box_one_second" id="box-appear"> <p>some text</p> </div> <button id="button-one"><img id="arrowdown"src="#"/> </button> </div>
jquery:
$(document).ready(function(){ $("#button-one").click(function(){ $(".box_one_second").toggle(200); $("#arrowdown").css('rotate',180); }); });
i can see i'm rotating 180 this, how able reverse once user clicks button go original pos. thanks
i'd recommend use jquery's toggleclass adding/removing class. can control rotation plain css.
img.rotate { transform: rotate(180deg); }
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <img src='http://lorempixel.com/400/200/' /> <button onclick="$('img').toggleclass('rotate')">rotate</button>
Comments
Post a Comment