is a Javascript notification library to display info messages on top of page.
<script src="js/infotop.js"></script>
<link href="css/infotop.css" rel="stylesheet">
<div id="infotop" class="infotop">
<div class="infotop-close" onClick="infoTopClose();"></div>
<div></div>
</div>
infoTop('Text to display', options); infoTopAppend('Text to append', options); infoTopClose();
infoTop('Hi there!');
infoTop('Close this notification manually', { fadeout_delay: 0, display_delay: 0 });
infoTop('Now click <b>Add text</b>', { fadeout_delay: 0, display_delay: 0 });Then add text
infoTopAppend('<div>Text added</div>');
infoTop('You can customize the style of your notifications', { fadeout_delay: 0, display_delay: 0, width: "400px", max-width: "70%", border: "1px solid #098CE3", background: "#52BAFF", color: "#FFFFFF" });
infoTop('You can control for how long the message is displayed', { fadein_delay: 100, fadeout_delay: 700, display_delay: 1000 });
{ // message container ID id: "infotop", // duration of the 'fade-in' transition effect, ms fadein_delay: 300, // duration of the 'fade-out' transition effect, ms fadeout_delay: 2000, // for how long to show the message, ms display_delay: 1000, // message container width width: "320px", // message container maximum width max_width: "90%", // message container border style border: "1px solid #FFB41E", // message background color background: "#FFE88D", // message text color color: "#000000" }Possible options and their defaults for infoTopAppend(); function
{ // message container ID id: "infotop", // duration of the 'fade-out' transition effect, ms fadeout_delay: 2000, // for how long to show the message, ms display_delay: 1000 }