Jquery: высота анимации - PullRequest
       9

Jquery: высота анимации

0 голосов
/ 06 сентября 2011

Хорошо, у меня все еще есть проблемы с моим элементом анимации.Я получил некоторую помощь раньше, и я почти получил ее, но у меня все еще есть одна проблема.Я пытался найти решение, но ничего не могу найти.

Когда я нажимаю на первую строку, она оживляет первую строку.Когда я нажимаю на вторую строку, она оживляет первую и вторую строки.Когда я нажимаю на третью строку, она анимирует первую, вторую и третью и т. Д.

Я хочу, чтобы она анимировала только ту, которая принадлежит этой строке.Не все из них одновременно.

Мой сценарий выглядит так:

<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>

Что я до сих порделать неправильно?

Ответы [ 2 ]

1 голос
/ 06 сентября 2011

вы используете один и тот же идентификатор new_user для всех пользовательских контейнеров. id является уникальным атрибутом, и этот код нарушает структуру HTML. просто используйте класс вместо id здесь.

http://jsfiddle.net/QswrL/

1 голос
/ 06 сентября 2011

Два быстрых замечания:

Для каждого пользователя, найденного в вашей базе данных, ваш скрипт выведет следующий 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 будет создаваться для каждого пользователя, возвращенного из базы данных. Идентификаторы должны быть уникальными, поэтому лучше добавлять суффикс к идентификаторам, когда они объявлены в циклах while. Идея состоит в том, чтобы реализовать счетчик в цикле while для добавления к идентификатору div.

Я не уверен, что идентичные идентификаторы отклонены или они все еще функционируют, но исправление это будет вашим первым шагом. Похоже, ваш скрипт анимируется на каждом элементе #new_user.

...