JavaScript Notification

Bind to the open event by type: jqxNotification. Author: http://jqwidgets.com

by jqwidgets

HTML

<link rel="stylesheet" href="https://jqwidgets.com/public/jqwidgets/styles/jqx.base.css">
<script src="https://jqwidgets.com/public/jqwidgets/jqx-all.js"></script>
<link rel="stylesheet" href="https://jqwidgets.com/public/jqwidgets/styles/jqx.energyblue.css">
<div id="jqxNotification">Sample notification</div>
<input type="button" id='jqxbutton' value="Open notification" />
<div id="log"></div>

JavaScript

$("#jqxNotification").jqxNotification({
    width: "auto",
    position: "top-right",
    opacity: 0.9,
    autoOpen: false,
    autoClose: true,
    template: "info"
});

$("#jqxbutton").jqxButton({
    theme: 'energyblue',
    width: 200,
    height: 30
});
$('#jqxbutton').click(function () {
    $("#jqxNotification").jqxNotification("open");
});

$('#jqxNotification').on('open', function () {
    $("#log").html("The open event is triggered");
});