timer - rotate - 2

<!doctype html>
<html lang="ko">
 <head>
  <meta charset="UTF-8">
  <title>rotate</title>
  <style>
            .imgs img {
                margin:10px;
                border-radius:50px;
            }
        </style>
 </head>
 <body>
        <div class="imgs">
            <img id="img1" src="http://lorempixel.com/100/100/animals">
            <img id="img2" src="http://lorempixel.com/100/100/city">
            <img id="img3" src="http://lorempixel.com/100/100/food">
        </div>
    <script src="http://code.jquery.com/jquery-1.11.0.min.js"></script>
    <script>
        var d = 0;
        var timer = null;
        var obj = null;
        function r(obj)
        {
            d = d + 10;
            if( d > 180 ) {
                d = 180;
                clearInterval(timer);
                timer = null;
            }
            var eff = "rotate(" + d + "deg)";
            $("#" + obj).css("transform",eff);
        }
        function r2(obj)
        {
            d = d - 10;
            if( d < 0 ) {
                d = 0;
                clearInterval(timer);
                timer = null;
            }
            var eff = "rotate(" + d + "deg)";
            $("#" + obj).css("transform",eff);
        }
        $(".imgs img").hover(
            function(){
                if ( timer != null ) {
                    clearInterval(timer);
                    timer = null;
                    d = 0;
                    if( obj != null) {
                        $("#" + obj).css("transform","rotate(0deg)");
                    }
                }
                obj = $(this).attr("id");
                timer = setInterval(
                    function(){
                        r( obj );
                    }, 10
                );
            },
            function(){
                if ( timer != null ) {
                    clearInterval(timer);
                    timer = null;
                }
                obj = $(this).attr("id");
                timer = setInterval(
                    function(){
                        r2( obj );
                    }, 10
                );
            }
        );
    </script>
 </body>
</html>