0

私は成功せずにいくつかの設定をしたいトースターを持っています。まず第一に、ここのように速く表示したいです:

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

しかし、それを行うオプションが見つかりません。ここのように非常に遅いです:

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

第二に、前者のようにぼやけないで、後者のようにしたい(不透明度なし)、

それ、どうやったら出来るの?

4

1 に答える 1

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;
}
于 2014-09-16T08:36:22.767 に答える