Skip to content

Instantly share code, notes, and snippets.

@lu1s
Created June 27, 2011 07:18
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 1 You must be signed in to fork a gist
  • Save lu1s/1048437 to your computer and use it in GitHub Desktop.
Save lu1s/1048437 to your computer and use it in GitHub Desktop.
jQuery alert() beautify and more user friendly
/*
* This function replaces the javascript native alert() function.
* I know that by convention it's not a good practice, but if you want to
* follow strict stuff, just declare the function with another name and
* call it as that.
*
* jQuery.js is required (http://jquery.com)
*
* The function can be called like this:
* For static (not auto-hide) alert bar:
* alert("my message <span>that supports html too</span>")
*
* For auto-hide after certain time:
* alert("the message",true) // for automatic timeout (2000 by default)
* alert("a messageee",4000) // with custom timeout in ms
*
*/
alert = function(what,auto){
// if the element hasn't been appended to the body element
if($("#alert_bar").length==0){
// customize the bar with css
var bar = $("<div/>").css({
'display':'none',
'position':'fixed',
'top':'0px',
'left':'0px',
'zIndex':'50',
'width':'100%',
'margin':'0px',
'padding':'5px auto 9px auto',
'textAlign':'center',
'fontSize':'14px',
'background':'#eee',
'color':'black',
'borderBottom':'solid 1px #333'
})
bar.attr("id","alert_bar")
$('body').prepend(bar)
}
// close button
$("#alert_bar").html('<div style="text-align:right;font-size:10px;color:red"><span style="cursor:pointer" onclick="$(\'#alert_bar\').slideUp()">[cerrar]</span></div><div>'+what+'</div>')
$("#alert_bar").slideDown()
if(auto){
if(typeof auto == 'boolean')
auto = 2000
window.setTimeout(function(){
$("#alert_bar").slideUp()
},auto)
}
}
@africanmx
Copy link

Mike, it is me from the future 9 years after. It has been a lot. Recently some weird stuff happened and that but that is not the point. The point is that you should wrap all your nasty shit into a (function(){ /* YOURSHIT */})();, and put everything in a window.onload. That, at least. Seeya! Silla.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment