Come disabilitare l'animazione per md-sidenav in angularjs

Question

Sto usando md-sidenav da Material Design in angularjs.

Domanda: È possibile disabilitare l'animazione di md-sidenav quando si apre e si chiude? Sembra che l'apertura e la chiusura siano animate di default.

<md-sidenav md-component-id="left" class="md-sidenav-left"> 
Left Nav! 
</md-sidenav> 

Answer 1

Prova aggiungere l'attributo md-no-ink al sidevav

<md-sidenav md-no-ink md-component-id="left" class="md-sidenav-left"> 
Left Nav! 
</md-sidenav> 

o rimuovere tutte le animazioni override del CSS:

.md-ripple-container, .md-ripple-placed { 
    transition: none; 
} 

di riferimento: https://groups.google.com/d/topic/ngmaterial/HJ01ZHEbOQA/discussion

Answer 2

Questa CSS ha funzionato per me Ho esaminato il file CSS AngularMaterial e rimosso tutti i riferimenti alle animazioni. KA-BOOM!

/** 
* fix md-sidenav lag by removing animation 
**/ 

.md-sidenav-backdrop { 
    opacity: 0 !important; 
} 

md-sidenav.md-closed-add, 
md-sidenav.md-closed-remove, 
md-sidenav.md-closed-add.md-closed-add-active, 
md-sidenav.md-closed-remove.md-closed-remove-active, 
md-sidenav.md-locked-open-remove-active, 
md-sidenav.md-closed.md-locked-open-add-active 

{ 
    -webkit-transition: none !important; 
    transition: none !important; 
} 

Answer 3

ho generare un disable-animations.css con il prossimo:

* { 
    -webkit-transition: none !important; 
    transition: none !important; 
} 

ho includere questo file alla fine di tutto.

Se avete bisogno di disattivare i controlli specifici, utilizzare:

disable-animation, 
disable-animation *, 
.disable-animation, 
.disable-animation * { 
    -webkit-transition: none !important; 
    transition: none !important; 
}