2010-06-06 35 views
5

Thật kỳ lạ. Tôi có một hoạt ảnh bắt đầu khi i .hover trên DIV. Trong div này tôi có một vị trí tuyệt đối mà tôi muốn di chuyển cho đến khi con chuột ở lại trên div chính và đi xuống ở vị trí của bạn khi tôi đi ra khỏi div chính. Một hiệu ứng di chuột đơn giản. Tôi đã viết chức năng này hoạt động tốt ngoài một lỗi lạ.Jquery animate bottom problem

  var inside = $('.inside') 

     inside.hover(function() { 
      $(this).children(".coll_base").stop().animate({ 
       bottom:'+=30px' 
      },"slow") 
      }, function() { 
      $(this).children(".coll_base").stop().animate({ 
       bottom:'-=30px' 
      },"slow"); 
      }); 

tôi cần + = 30 và - = 30 vì tôi phải áp dụng chức năng này cho một dải div có đáy khác nhau. Vấn đề là nếu tôi di chuột vào và ra khỏi div thì DIV hoạt hình đúng nhưng khi đi xuống, anh ta sẽ giảm giá trị của mỗi hoạt ảnh xuống dưới. Nếu tôi đi lên và xuống từ div chính tôi thấy rằng div hoạt hình đi xuống thậm chí vượt ra ngoài div chính. Tôi nghĩ rằng tôi bỏ lỡ một cái gì đó để giải quyết lỗi này. Cảm ơn bạn đã giúp đỡ

Trả lời

5

Nếu bottom không phải là 0 lúc đầu, thì bạn có thể lưu trữ giá trị dưới cùng ban đầu và sử dụng chức năng thứ hai. (Nếu ban đầu bottom0, sau đó chỉ cần sử dụng.)

Trong ví dụ dưới đây, vị trí ban đầu bottom được lưu trữ bằng cách sử dụng thuộc tính data() cho inside, sau đó nó được lấy ra trong xử lý thứ hai để trở về vị trí ban đầu .

Sống dụ:http://jsfiddle.net/VAsZZ/

var inside = $('.inside'); 

inside.hover(
    function() { 
     if(!inside.data('bottom')) { 
      inside.data('bottom',$(this).children(".coll_base").css('bottom')); 
     } 
     $(this).children(".coll_base").stop().animate({ bottom:'+=30px' },"slow") 
    }, 
    function() { 
     $(this).children(".coll_base").stop().animate({bottom:$(this).data('bottom') },"slow"); 
    } 
);​ 
+0

cảm ơn bạn! nó hoạt động tuyệt vời! – andrea

+0

@andrea - Bạn được chào đón. : o) – user113716

0

Tôi không nghĩ rằng bạn có thể sử dụng tương đối (- = 30px và + = 30px) giá trị trong trường hợp này, như các hình ảnh động có thể dừng lại ở bất kỳ điểm nào tùy ý mà sẽ ném ra các hình động theo sau nó. Tốt nhất để gọi mỗi() trên tập hợp đã kết hợp, tính toán độ lệch chính xác và chuyển giá trị trực tiếp vào hàm di chuột của bạn.