带有引导警报的Angularjs-向下滚动时将警报保持在屏幕上答案

【问题标题】：Angularjs with bootstrap alert - keep the alert on screen when scroll down带有引导警报的Angularjs-向下滚动时将警报保持在屏幕上
【发布时间】：2014-11-18 03:58:19
【问题描述】：

我使用的示例来自 http://angular-ui.github.io/bootstrap/

<div ng-controller="AlertDemoCtrl">
     <alert ng-repeat="alert in alerts" type="{{alert.type}}"
        close="closeAlert($index){{alert.msg}}>    
    </alert>
    <button class='btn btn-default' ng-click="addAlert()">Add Alert</button>
</div>

当我向下滚动时，警报会从屏幕上消失。当用户向下滚动时，如何将警报向下移动？

【问题讨论】：

与 JS 或 Angular 无关...这是一个 CSS 问题。您的提醒标签已打开。
看看github.com/jirikavi/AngularJS-Toaster，这是一个非常好的非阻塞通知解决方案
位置：固定 + CSS 中的 z-index
DeadCalimero，我建议您将其发布为 anwser，以便我可以将此解决方案标记为正确的 anwser。谢谢！

标签： css angularjs twitter-bootstrap alert angular-ui-bootstrap

【解决方案1】：

我建议在您的警报中添加一个类。然后按照@DeadCalimero 的建议，添加以下css：

.alert-float {
  position: fixed,
  top: 10px,    // adjust if needed
  z-index: 1000 // or higher if needed
}

【讨论】：

【解决方案2】：

使用引导类'附加'检查这个http://getbootstrap.com/javascript/#affix，

【讨论】：