jak używać ważne w jQuery animate() funkcji

Question

proszę zobaczyć poniżej jQuery:

Jestem naprawdę zastanawiasz się w jaki sposób można użyć CSS !important dla height w tym kodzie.

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

CSS od #lveis-wrapper_3 jest poniżej:

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

nie mogę usunąć !important z height: 936px z jakichś powodów ...
więc chcę to zmienić height przez animate() funkcji jQuery - ale jak ?

Answer 1

Po prostu nie możesz tego zrobić.

Zgodnie ...

„Wszystkie animowane właściwości powinny być animowane do pojedynczej wartości liczbowej ... ... większość właściwości, które są non-numeryczny nie może być animowane przy użyciu podstawowego jQuery funkcjonalność ...”

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

---

Zdecydowanie zalecamy ponowne sprawdzenie Twojej potrzeby pod kątem !important.

Answer 2

Nie możesz tego zrobić, ale spróbuj tego!

W zależności od tego, czy jest to DIV, IMG, ... będziesz musiał zrobić coś takiego. Ten przykład dotyczy obrazu:

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

Priorytety definiuje się w CSS ze specyficznością selektora. Swoją specyficzność selektor dla ID był 1.0.0, ale dodanie img # ID teraz jest 1.0.1, dlatego priorytetem jest wyższa.

Answer 3

Możesz użyć przejścia css, aby działało, ponieważ przejście css zadziała nawet wtedy, gdy atrybut stylu zostanie zmieniony przez $ (elem) .attr ('style', '...');

użyć:

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