2014-09-16 3 views
0

У меня есть тостер, который я хотел бы сделать несколько конфиги на ней без успеха, в первую очередь, я хочу, чтобы показать его быстро, как здесь: (показать продолжительность?)Тостер варианты angularjs, как

http://codeseven.github.io/toastr/demo.html 

но я не найти вариант, который будет делать это, это очень медленно, как здесь:

http://plnkr.co/edit/mVR4P4?p=preview 

во-вторых, я хочу, чтобы не быть blury как бывший, но я хочу его быть похожим на последний (без непрозрачности),

Как мне это сделать?

ответ

2

Вы можете установить, что в CSS см здесь http://plnkr.co/edit/63eCUz?p=preview

Q1:

transition: 100ms <- just adjust transaction duration 

Q2:

.animateToaster-enter.animateToaster-enter-active, 
.animateToaster-leave { 
    opacity: 1; <-set that to 1 instead of 0.8 
} 

Пример CSS Код:

/*Animation CSS3*/ 
.animateToaster-enter, 
.animateToaster-leave 
{ 
    -webkit-transition: 100ms cubic-bezier(0.250, 0.250, 0.750, 0.750) all; 
    -moz-transition: 100ms cubic-bezier(0.250, 0.250, 0.750, 0.750) all; 
    -ms-transition: 100ms cubic-bezier(0.250, 0.250, 0.750, 0.750) all; 
    -o-transition: 100ms cubic-bezier(0.250, 0.250, 0.750, 0.750) all; 
    transition: 100ms cubic-bezier(0.250, 0.250, 0.750, 0.750) all; 
} 

.animateToaster-enter.animateToaster-enter-active, 
.animateToaster-leave { 
    opacity: 1; 
} 

.animateToaster-leave.animateToaster-leave-active, 
.animateToaster-enter { 
    opacity: 0; 
} 
Смежные вопросы