Jquery：动画高度

好吧，我的动画元素仍然存在一些问题。我得到了一些帮助，我几乎得到它，但我仍然有一个问题。我试图找到一个解决方案，但我找不到任何东西。Jquery：动画高度

当我点击第一行时，它动画的第一行。当我点击第二行时，它动画第一行&第二行。当我点击第三行时，它会动画第一个，第二个&，等等。

我希望它只有属于该行的一个动画。并不是所有的人都一次。

我的剧本是这样的：

<script> $(document).ready(function() { $("#new_user").live("click", function() { $(this).children(".new_users_box").animate({opacity: 'toggle' }); }); }); </script>

而且我的HTML/PHP代码是这样的：

<div id="new_memb_content" class="box_square"> 
    <img src="mysite/resources/newest-members.png" width="245" height="27" style="margin-left:-8px;" /><br><br> 
     <?php 
     if ($_SESSION['username']) 
     { 
      include 'db_connect.php'; 
      $sql = "SELECT username, id, gender, user_thumb1 FROM members ORDER BY members.`id` DESC LIMIT 20"; 
      $result = mysql_query($sql); 

      while ($row = mysql_fetch_array($result)) 
      { 
       $thumb1 = $row['user_thumb1']; 
       $new_id = $row['id']; 
       $new_user = $row['username']; 

       echo ' 
       <div id="new_user"> 
       <a class="box_round" style="background-color:#101010 !important;">'.$new_user.'</a> 
       <div class="box_newest new_users_box"><br> 
       <a href="mysite/user.php?id='.$new_id.'"><img class="new_user_thumb" src="'.$thumb1.'" /></a> 
       </div> 
       '; 
      } 
     } 

     else 
     header("location:mysite"); 
     ?> 
     </div>

什么我还是做错了什么？

来源

2011-09-06 Kaizokupuffball

两个快速备注：

对于你的数据库中找到的每个用户，你的脚本将回声所需的信息下面的div：

<div id="new_user"> 
       <a class="box_round" style="background-color:#101010 !important;">'.$new_user.'</a> 
       <div class="box_newest new_users_box"><br> 
       <a href="mysite/user.php?id='.$new_id.'"><img class="new_user_thumb" src="'.$thumb1.'" /></a> 
       </div>

你的div #new_user会为每个用户产生返回来自数据库。 ID必须是唯一的，所以最好在while循环中声明时为ID添加后缀。一个想法是在while循环中实现一个计数器来添加到div的ID。

我不确定相同的ID是否被解雇或者他们仍然有效，但修复此问题将是您的第一步。似乎你的脚本在每个#new_user div上都有动画效果。

来源

2011-09-06 17:14:27 Prusprus

对所有用户容器使用相同的ID new_user。 id是唯一属性，并且此代码违反了html结构。在这里只使用class而不是id。

http://jsfiddle.net/QswrL/

来源

2011-09-06 17:20:47

Jquery：动画高度

回答

相关问题