Welcome to JS Bin

JS Bin

Save
Blog
Help
Load cached copy from
  • Run with JS
  • Save
  • Share
  • …
 
<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <title>JS Bin</title>
      <link href="http://cdn.kendostatic.com/2014.1.416/styles/kendo.common.min.css" rel="stylesheet" />
    <link href="http://cdn.kendostatic.com/2014.1.416/styles/kendo.default.min.css" rel="stylesheet" />
      <script src="http://cdn.kendostatic.com/2014.1.416/js/jquery.min.js"></script>    
    <script src="http://cdn.kendostatic.com/2014.1.416/js/kendo.ui.core.min.js"></script>   
  
</head>
<body>
  
  <span id="popupNotification"></span>
  <button name="show" id="show">Show it!</button>
  <div id="container"></div>
</body>
</html>
 
#container {
  border: 1px solid;
  height: 200px;
  width: 200px;
  overflow: auto;
}
 
var popupNotification = $("#popupNotification").kendoNotification( { 
    position: {
      top: 30                             },
    width: "120px",
    autoHideAfter: 3000,
    button: true,
    appendTo: "#container"
}).data("kendoNotification");
​
$("#show").click(function(){
​
  popupNotification.show("Hey there!", "info");
  
});
Output

You can jump to the latest bin by adding /latest to your URL

Dismiss x