Html ui视图淡入过渡

我有以下CSS标记，以便在AngularJS中的视图更改时平滑淡入过渡：

[ui-view].ng-enter {
    transition: .7s;
    opacity: 0;
}

[ui-view].ng-enter-active {
    opacity: 1;
}

当使用我创建的导航菜单时，它工作正常，但当我直接在视图上着陆时（即：

/#/products/1

），没有淡入。是否有任何其他事件需要添加代码

---

谢谢。

您可以尝试以下方法：

[ui-view].ng-enter {
     opacity:0.7
    -webkit-transition:opacity 2s ; 
    -moz-transition:opacity 2s ; 
    -o-transition:opacity 2s ; 
    -ms-transition:opacity 2s ; 
    transition:opacity 2s;
}

[ui-view].ng-enter-active { opacity:1;}

/* Have to set height explicity on ui-view 
to prevent collapsing during animation*/

.animated-view.well{
 height: 65px; 
}

.ui-view-container {
  position: relative;
}


.ng-enter, .ng-leave {
  position: absolute;
  left: 0;
  right: 0;
  -webkit-transition:all .5s ease-in-out;
    -moz-transition:all .5s ease-in-out;
    -o-transition:all .5s ease-in-out;
    transition:all .5s ease-in-out;
}

.ng-enter {
  opacity: 0;
}

.ng-enter-active {
  opacity: 1;
}

.ng-leave {
  opacity: 1;
}

.ng-leave-active {
  opacity: 0;
}

---

我已经在中设置了一个简单的演示应用程序，可以使用动画。

如果您能发布更多相关代码，可能会更容易提供帮助。可能你的视图是如何设置的。好的，你想知道什么？我认为所需的CSS独立于视图的设置方式。您可以立即运行一个函数，并在正在处理的任何视图的指令控制器中添加动画类。您正确阅读了问题吗？您刚刚添加了供应商前缀。请在回答中添加一些有用的信息和/或说明，说明您认为这可以用来解决问题的原因