jquery - 使用 notify.js 在网站上放置通知

标签 jquery html css twitter-bootstrap

我正在尝试使用 bootstrap 和 notify.js( http://notifyjs.com/ )/jQuery 显示全局通知。使用以下代码让通知正常工作没有问题:

$.notify('successfully logged in','succes');

但是我希望通知显示在 Bootstrap 导航栏下方的右上角,或者换句话说,我希望顶部通知显示在页面顶部下方 50 像素处。

在基类中使用 "margin-top":"50px" 似乎可行,但第二个通知也显示为低 50px。

非常感谢任何帮助

最佳答案

我在 http://notifyjs.com 上试了一下这个例子.所有全局通知都添加到容器中 <div>与类 .notifyjs-corner .查看源代码似乎没有选项可以覆盖此类的默认 css 样式。容器通过向 html 元素添加内联样式来设置其定位。例如,一种覆盖它的方法是:

.notifyjs-corner {
    top: 70px !important;
}

另一个我认为更好的解决方案是不使用全局通知,而是创建您自己的定位元素。例如创建一个像 <div class="notifications"> 这样的元素, 使用您自己的 css 定位它并使用 $('.notifications').notify('successfully logged in', 'success'); 向它添加通知

关于jquery - 使用 notify.js 在网站上放置通知,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/27468544/

相关文章:

使用toggleClass更改类后的jQuery事件

jquery - 单击两次后 Bootstrap 侧边栏下拉菜单关闭

html - CSS:在按钮的跨度中垂直对齐 p ... 或不?

css - 跨浏览器动画抗锯齿

javascript - 根据表格第一行第一列的数据创建表格

javascript - 页面加载时自动运行 Javascript

javascript - 即使其他 JS 工作正常,Twitter 的 Bootstrap Popover : Won't work,

html - 不透明的当前颜色

javascript - 通过 Javascript 更新多个选择值

javascript - 结合悬停和焦点选择器样式但不同时