0

I need a modern option for displaying a notification header to the user. The implementation needs to be cross-browser compatible and as lightweight as possible. My manager recommended the use of VanillaJs so a vanillaJs plugin would be ideal but if you can make a case for a better different solution then I can pass that along to my manager.

Also, the intent of this solution is to display the notification in a wide variety of websites across the enterprise. From a ux perspective do you think this design may be better implemented as a popup? I'm wondering if this may appear less shoehorned than displaying a modern notification header in an app with an older ui design.

user6604655
  • 863
  • 2
  • 9
  • 18
  • What do you mean by "in the browser header"? – gcampbell Jul 25 '16 at 18:33
  • 1
    [VanillaJS?](http://vanilla-js.com/) Umm, I've some news for you. That ain't a thing. It's just [vanilla](https://en.wikipedia.org/wiki/Plain_vanilla) JavaScript. With that in mind `document.title = "new title"` - cross-browser and lightweight. – VLAZ Jul 25 '16 at 18:35
  • Possible duplicate of [How to dynamically change a web page's title?](http://stackoverflow.com/questions/413439/how-to-dynamically-change-a-web-pages-title) – VLAZ Jul 25 '16 at 18:35
  • here's an example image of a notification bar: https://www.dropbox.com/s/ivws5gxvz8zihzi/notification-bar.png?dl=0 – user6604655 Jul 25 '16 at 18:43
  • OK, by "browser header" I thought you meant the document title (which is displayed in the browser window title). So, what you want is a pop-up notification. Simplest way programmatically create a `div`, make it `position: absolute` and fill it in with data. Also have `onclick` handler to dismiss it (probably by just setting `visibility: none`). You can also use a library like [toastr](http://codeseven.github.io/toastr/demo.html) (requires jQuery). – VLAZ Jul 25 '16 at 18:56

1 Answers1

0

You can use Screamer.JS, fully written in VanillaJS

https://github.com/willianjusten/screamer-js

Wendel Nascimento
  • 171
  • 5
  • Erm, doesn't do what the OP wants. 1. Not cross-browser. 2. Displays notifications only. – VLAZ Jul 25 '16 at 18:37