<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" name="viewport" content="width=device-width, initial-scale=1"/> <link rel="stylesheet" type="text/css" href="css/bootstrap.css"/> <style> .rotater { transition: all 0.3s ease; border: 0.0625em solid black; border-radius: 3.75em; } </style> </head> <body> <nav class="navbar navbar-default"> <div class="container-fluid"> </div> </nav> <div class="col-md-6 well"> <hr style="border-top:1px dotted #ccc;"/> <div class="col-md-6"> </div> </div> </body> </html>
var angle = 0; function rotateRight(){ var img = document.getElementById('image'); angle += 90; image.style.transform = "rotate("+angle+"deg)"; } function rotateLeft(){ var img = document.getElementById('image'); angle -= 90; image.style.transform = "rotate("+angle+"deg)"; }