Не работает анимация изображения

Рейтинг: 0Ответов: 0Опубликовано: 27.03.2015

Всем привет. Хочу реализовать анимацию изображения при клике.

Вот код.

Html

<div class="product_list">
<table width="100%">
    <tr>
        <td valign="top" width="220px"> 
            <img src="img/кртинка.jpg" width="200px" id="img"/>

        </td>
    <td>
    <button class="add_cart">Добавить<span></span></button>
    </td>

</div>

Jquery

$(".product_list .add_cart").click(function () {
var cart_offset = $("#cart").offset(); //получаем координаты корзины

     var button_offset = $(this).offset(); //получаем координаты кнопки

     var cart_img = $('#img');
     cart_img 
              .clone()  
              .css({'position' : 'absolute', 'z-index' : '100','top':  button_offset.top, 'left': button_offset.left})  
              .appendTo('.product_list')  
              .animate({opacity: 0.5,   
                            marginLeft: 100,
                            top:cart_offset.top,
                            left:cart_offset.left,  
                            width: 10,   
                            height: 10}, 700, function() {  
                    $(this).remove();  
              });  
 });

Анимаци должна работать, но не работает, что я делаю не так?

Проблему нашел. У меня есть css свойство главного блока position:relative;.

И почему-то не работает position:absolute.

Ответы

Ответов пока нет.