angularjs – 页面加载后如何淡入文本？

发布时间：2020-12-17 17:40:41 所属栏目：安全来源：网络整理

导读：我试图在页面加载后获得一个带有一些文本的div容器,但是我失败了.我正在使用这样的ng-animate指令： div class="motd" style="text-align: center;" ng-init="quote = getQuote();" div class="slide-fade" ng-class="animation" span class="quote"i{{quote

我试图在页面加载后获得一个带有一些文本的div容器,但是我失败了.我正在使用这样的ng-animate指令：

<div class="motd" style="text-align: center;" ng-init="quote = getQuote();">
    <div class="slide-fade" ng-class="animation">
        <span class="quote"><i>{{quote.content}}</i></span><br><br>
        <span class="author">{{quote.author}}</span>
    </div>
</div>

这显然不起作用,因为动画不会被点击或类似的东西触发.

那么如何告诉浏览器页面加载后,它应该淡入我的文本？

我希望你能帮帮我！

编辑：在我问的日期,我不知道动画也会在页面加载时触发.我一直认为必须有一些“用户交互”,如点击或触发它们的东西.

解决方法

如果您使用的是bootstrap,则可以执行以下操作：

<html ng-app="myApp" ng-strict-di>
<head>...</head>
<body ng-init="ngLoaded = true" class="fade" ng-class="{ in: ngLoaded }">
  <div>Content</div>
</body>
</html>

它也可能以这种方式工作：

<body
  ng-app="myApp"
  ng-strict-di
  ng-init="ngLoaded = true"
  class="fade"
  ng-class="{ in: ngLoaded }">
<div> Content </div>
</body>

淡入淡出类具有0不透明度,而类中应用过渡.一旦由于ng-init =“ngLoaded = true”加载角度,ngLoaded将变为真(在$rootScope中,我相信).

我使用这个,以便在页面加载时页面不会被一些尖括号括起来.

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!