làm thế nào để sử dụng quan trọng trong jQuery animate() chức năng

Question

Hãy xem jQuery dưới đây:

Tôi thực sự tự hỏi làm thế nào tôi có thể sử dụng CSS !important cho height trong mã này.

 $j('#lveis-wrapper_3').animate({ 
      opacity: 0.0, 
      height : 200 
     }, 1200); 

CSS của #lveis-wrapper_3 là dưới đây:

#lveis-wrapper_3 
{ 
    width: 844px !important; 
    height: 936px !important; 
    margin: 0pt 0pt 10px !important; 
    padding: 0pt !important; 
    float: none; 
} 

tôi không thể loại bỏ !important từ height: 936px đối với một số lý do ...
vì vậy tôi muốn thay đổi điều đó height bởi animate() jQuery chức năng - nhưng làm thế nào ?

Answer 1

Bạn không thể thực hiện việc này.

Theo ...

"Tất cả các đặc tính hoạt hình nên được hoạt hình với một giá trị số đơn ... ... hầu hết các tính năng mà không phải số không thể được hoạt hình sử dụng jQuery cơ bản chức năng ..."

http://api.jquery.com/animate/

---

Tôi khuyên bạn nên kiểm tra lại nhu cầu của mình cho !important.

Answer 2

Bạn không thể làm điều đó, nhưng hãy thử điều này!

Tùy thuộc vào việc đó là DIV, IMG, ... bạn sẽ phải làm điều gì đó như thế này. Ví dụ này là trong trường hợp của một hình ảnh:

$j('img#lveis-wrapper_3').animate({ 
     opacity: 0.0, 
     height : 200 
    }, 1200); 

Ưu tiên được xác định trong CSS với độ đặc hiệu chọn. đặc chọn của bạn cho #ID là 1.0.0, nhưng thêm img # id tại là 1.0.1, do đó ưu tiên cao hơn.

Answer 3

Bạn có thể sử dụng chuyển tiếp css để làm cho nó hoạt động, vì chuyển tiếp css sẽ hoạt động ngay cả khi thuộc tính kiểu được thay đổi bởi $ (elem) .attr ('style', '...');

bạn sử dụng:

js

// the element you want to animate 
$(elem).attr('style', 'your_style_with_important'); 

css

elem { 
    transition: all 0.2 linear; 
    -moz-transition: all 0.2 linear; 
    -webkit-transition: all 0.2 linear; 
}