jQuery .animate somehow not reacting (for a WP site)
<p>This is a bit embarrassing and frustrating in one. What I am trying to do is animate the width and the position of divs for a site. I have made a test and it works fine there:</p>

<p><a href="http://romanaltenburg.com/temp/test.php" rel="nofollow">http://romanaltenburg.com/temp/test.php</a></p>

<p>Hoever, for the real website, the .animate does nothing at all. Here is my code</p>

<pre><code>$(document).ready(function() {

        pWidth = $("#all_staff").width();
        pLeft = $("#all_staff").position();
        pLeft = pLeft.left;
        pCount = $("#[id^=member_]").size();
        pPercent = 100/pCount;
        zIndex = 0;
        colors = ["#CCCCCC","#333333","#990099","#9624CF","#CCCCCC"];

        //$("#[id^=member_]").addClass("staff_member");
        $("#[id^=member_]").css("width", pWidth/pCount);
        $("#[id^=member_]").css("z-index", zIndex);

        for (i=1;i&lt;=pCount;i++){
            $("#member_"+i).css("left", (pWidth/pCount)*(i-1)+pLeft+"px");
            $("#member_"+i).css("backgroundColor", colors[i]);
        }

        $("#[id^=member_]")
            .hover(function() {
                $(this).animate({ left: 20 }, 'fast');
            }, function() {
                $(this).animate({ left: 0 }, 'fast');
        });

});
</code></pre>

<p>The REALLY frustrating part is that any other function works fine for those divs. So if I write this here</p>

<pre><code>$("#[id^=member_]")
  .hover(function() {
      $(this).css("left", "20px");
  }, function() {
      $(this).css("left", "0px");
});
</code></pre>

<p>the divs jump where I tell them to. Why? WHY? WHYYYYYYYYYYY? :) Don't get it, please help me out. Thank you very very much!</p>
