анимация простой функции jquery

Question

У меня есть простая функция jquery, которая изменяет размер таблицы при нажатии.

    <script type="text/javascript" src="jquery-1.3.2.min.js"></script>

    <script type="text/javascript">
        $(document).ready(function()
        {
            $('.expand_table').live("click", function()
            {
                $('.expand_table').attr('width', 800);
            }); 
        });
    </script>

Как бы я использовал это, чтобы таблица плавно расширялась или увеличивалась до нового размера?

Answer 1

Вы не можете анимировать атрибут, хотя. Так что вам нужно установить размер в CSS. Просто переключите

$('.expand_table').attr('width', 800);

для:

$('.expand_table').animate({ "width":"800px" }, 500); //uses 500ms to complete

Answer 2

См. Здесь: http://jqueryui.com/docs/Effects/Methods

Много примеров, где вы можете подать заявку.

Лучший

Answer 3

Используйте функцию анимации с большим количеством опций

одушевленные

$(".expand_table").animate({ width: "800px" }, 1500 );

<script type="text/javascript">
    $(document).ready(function()
    {
        $('.expand_table').live("click", function()
        {
                //$('.expand_table').attr('width', 800);
                $(".expand_table").animate({ width: "800px" }, 1500 );
                // 1500 can be replaced with "slow", "normal", or "fast" or a 
                // number that specifies the speed of the animation
        }); 
    });
</script>