How to create a warning window using CSS?

Question

- Update - I read a lot on this issue, tried several scripts and needed help to find out what you can or cannot do. The community has responded to all of this, and the next good starting point. (answers here are extracted from the community below, thanks)

• YOU CAN'T MAKE A DEFAULT STYLE. It is created by your client (e.g. 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 ('Enter the domain name to search.'); return false; }

because of what the client (firefox chrome, etc.) creates a warning window.

2b. You will tell the code if something should happen in the jquery event loading window, which you can do quite: (Jonathan Payne answered and created Jonathan Payne. Thanks)

<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> 

Take a look here jsFiddle: http://jsfiddle.net/8cypx/12/

Answer 1

Try the jQuery UI located here: http://jqueryui.com/demos/dialog/

They have a thematic video in which you can create dialog boxes and modal fields.

- EDIT -

Answering your second question.

Take a look here jsFiddle: http://jsfiddle.net/8cypx/12/

 <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> 

Answer 2

Instead of the built-in pop-ups of the built-in Javascript - which are ugly and impossible to customize with CSS - I would recommend using the elements of the jQuery dialog box. They can be easily styled, and jQuery comes with many built-in themes for it.

http://docs.jquery.com/UI/Dialog

Answer 3

If you have a question correctly, I don’t think you can do this because the pop-ups are connected to the client system. However, designing what you described is not so difficult, viewing a DIV element or something like that.

Answer 4

The confirmation / warning field is part of the browser, not your page.

Answer 5

Use the plugin below http://plugins.jquery.com/msgbox/
and use the code

$ warning ('text') ;.

instead of warning ("text"); Configure with css