Adding Dialogue Boxes IN HTML5 AND CSS3.

This post is about adding Dialogue Boxes in html.
Here is the implementation of the logic.

<!DOCTYPE html>
<html>
<head>
<title>HTML dialog Tag</title>
</head>
<body>


<dialog id="dialog">
<form method="dialog">
<h3> Hello</h3>
<menu>
<button id="close" type="reset">Close</button>
</menu>
</form>
</dialog>

<menu>
<button id="click">Click Me</button>
</menu>

<script>

(function()
{
var clickButton = document.getElementById('click');
var closeButton = document.getElementById('close');
var Dialog = document.getElementById('dialog');

// Update button opens a modal dialog
clickButton.addEventListener('click', function() {
Dialog.showModal();
});

// Form close button closes the dialog box
closeButton.addEventListener('click', function() {
Dialog.close();
});

})();

</script>

</body>
</html

Post any problem if encountered in the comments.
Thanks for visiting GIMIBITS.
Please share this post and like us on Facebook.

HITESH BHATIA
_{EDITOR IN CHIEF}

Comments

Removing HTML Tags from string in C#

Hello friends, With this very first post of our new Blog GimiBits, we start our whole new journey contributing to information technology. Our First post is about the logic to remove the HTML tags from the given string with C# (C Sharp) programming language. Logic is very Simple to Implement, we take up a string and for its each index char we find the opening '<' braces and ignores the inside content until the closing '>' braces is not encountered and save to another char[] datatype. Here is a function based Implementation of the logic: public string RemoveHtmlTags(string Html) { string content = Html; char[] array = new char[content.Length]; int arrayIndex = 0; ...

C-Operators

An operator is a symbol that operates on a certain data types and produce the output as the result of the operation. Category of Operators • Unary Operator An unary operator is an operator which operates on one operand that is it operates on itself. Operand1 operator Here Operand1 may be a variable , a constant or an expression etc. For example: -b , ~a , x+1 etc. • Binary Operator A binary operator is an operator which operates on two operands. Operand1 operator Operand2 Here Operand1 and Operand2 maybe a variable, a constant or an expression etc. and Operator must be either arithmetic type or relational type or logical type etc. For example: a+b , a && b , etc. • Ternary Operator A ternary operator is an operator which operates on 3 operands. Operand1 o perator Operand2 operator Operand3 Here Operand1 , Operand 2 , Operand3 may be a variable ...

GimiBits

Search This Blog