我想使用jQuery Notifications plugin,但它始终将通知栏放在页面顶部。因此,如果页面很大,则必须向上滚动到顶部以查看通知。
是否可以让通知始终显示在浏览器窗口的顶部,这样用户就不必向上滚动到页面顶部了?
这是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;
}
答案 0 :(得分:8)
改变这个......
#jquery-notifications {
position: relative;
...
}
......对此...
#jquery-notifications {
position: fixed;
...
}
固定定位是相对于视口而不是文档。
答案 1 :(得分:7)
不知道标记的实际使用方式,我无法给你一个确切的解决方法。
但是将position: fixed;
添加到容器(#jquery-notifications)应该让它始终显示在最顶层。