Stopping rotation by hovering the child
<p>I want to hover the menu so I can stop the rotation, which is circle, parent of menu, but i don't know how to make it work. I am using animation to animate the circle as parent so the child will all follow the rotation. and I use spin so the child won't be wrongly spinned.</p>

<p>I have this</p>

<pre><code>&lt;div id="circle"
  style="margin-left:430px;margin-top:60px;width:450px;height:450px;
  border-radius:15%;position:absolute;z-index:1;
  -webkit-animation: spin 6s linear infinite reverse;"&gt;
      &lt;a href="#" class="menu"
      style="margin-left:15px;margin-top:20px;background-color:#91c8e5;"&gt;
        &lt;p&gt;Java&lt;/p&gt;
      &lt;/a&gt;
      &lt;a href="#" class="menu"
      style="margin-left:285px;margin-top:20px;background-color:#c3f797;"&gt;
        &lt;p&gt;C++&lt;/p&gt;
      &lt;/a&gt;
      &lt;a href="#" class="menu"
      style="margin-left:15px;margin-top:290px; background-color:#a09cea;"&gt;
        &lt;p&gt;Python&lt;/p&gt;   
      &lt;/a&gt;
      &lt;a href="#" class="menu"
      style="margin-left:285px;margin-top:290px; background-color:#fff368;"&gt;
        &lt;p&gt;PHP&lt;/p&gt;  
      &lt;/a&gt;
  &lt;/div&gt;
</code></pre>

<p>and this</p>

<pre><code>$(document).ready(function(){
    /*main*/
    $("#logo").click(function(){
        $(".menu").animate({
            opacity: '1',   
        });
    });
    $(".menu").hover(function(){
        $("#circle").stop(true);
    });
    $("#logo").dblclick(function(){
        $(".menu").animate({
            opacity: '0'
        });
    });

    /*
    login
    $("#create").click(function(){
        $(".left").animate({
            "margin-left": '-=200px'
        });

        $(".right").animate({
            opacity: '1'
        });
    });
    */  
});
</code></pre>

<p>This part seems not working</p>

<pre><code>$(".menu").hover(function(){
        $("#circle").stop(true);
    });
</code></pre>

<p>Thanks for helping!</p>