微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

如何在屏幕顶部显示通知?

如何解决如何在屏幕顶部显示通知?

| 我想使用jQuery Notifications插件,但始终将通知栏放在页面顶部。因此,如果页面很大,则必须向上滚动到顶部才能看到通知。 是否可以使通知始终显示在浏览器窗口的顶部,这样用户就不必向上滚动到页面顶部? 这是CSS,如果那是应该更改的地方?
/* jQuery Notifications plugin - http://programmingmind.com */
/* notification container */
#jquery-notifications {
  position: relative;
  width: 100%;
  left: 0;
  top: 0;
  z-index: 100000;
}
#jquery-notifications p {
  text-align: center;
  position: relative;
  margin: 0;
  padding: 5px;
  padding-left: 10px;
  border-bottom: 2px solid;
  /* style property for the close text */
}
#jquery-notifications p a {
  position: absolute;
  right: 10px;
  margin-right: 10px;
  color: black;
  text-decoration: none;
  border: 1px solid black;
  padding-right: 5px;
  padding-left: 5px;
}
#jquery-notifications .notice {
  background: #6c9ffc;
  color: #061a72;
  border-color: #061a72;
}
#jquery-notifications .success {
  background: #96f96f;
  color: #045419;
  border-color: #045419;
}
#jquery-notifications .warning {
  background: #f7ae57;
  color: #753903;
  border-color: #753903;
}
#jquery-notifications .error {
  background: #f97c6f;
  color: #570f01;
  border-color: #570f01;
}
    

解决方法

不知道标记的实际使用方式,我无法提供确切的解决方法。 但是在容器中添加
position: fixed;
(#jquery-notifications)应使其始终显示在顶部。     ,改变这个...
#jquery-notifications {
  position: relative;
  ...
}
...对此...
#jquery-notifications {
  position: fixed;
  ...
}
固定位置是相对于视口而不是文档。     

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 [email protected] 举报,一经查实,本站将立刻删除。