How do I style the alert box with CSS?

ferdi35

New Member
-- Update --i have read a lot on the subject tried a few scripts and needed help to find out what you can or cant do. Community answered it all and the following is a good starting point. (answers here extracted from community below, thank you)[*]YOU CAN NOT OVERIDE DEFAULT STYLE OF ALERT. It is produced by your client (eg. chrome firefox etc)[*]you can use jquery instead. Instead of using a script like:function check_domain_input() { var domain_val = document.getElementsByName('domain'); if (domain_val[0].value.length > 0) { return true; } alert('Please enter a domain name to search for.'); return false;}which makes the client (firefox chrome etc) produce an alert box.2b. You tell the code if somethings needs to happen on a event load jquery alertbox which you can make pretty: (Answered by Jonathan Payne and created by Jonathan Payne. Thank you)\[code\]<link rel="stylesheet" href="http://code.jquery.com/ui/1.8.21/themes/base/jquery-ui.css" type="text/css" media="all" /><div onclick="check_domain_input()">Click</div><div id="dialog" title="Attention!" style="display:none"> Please enter a domain name to search for.</div><script> function check_domain_input() { $( "#dialog" ).dialog(); // Shows the new alert box. var domain_val = document.getElementsByName('domain'); if (domain_val[0].value.length > 0) { return true; } $( "#dialog" ).dialog(); return false; }</script>\[/code\]Check out the jsFiddle here: http://jsfiddle.net/8cypx/12/
 
Back
Top