jQuery Cookie Create, Get Read, Delete Erase with Example

Scroll to a div using jquery

How to Open link in a New Tab When Click any where on page using jquery

show display loading image on button click example

Show Loading Image in Webpage while Page Loads example

How to disable submit button after clicked with jQuery

[setp6]data binding in angularjs using controller

[step 5]How can I iterate over the keys, value in ng repeat in angularjs

[step4]Looping With Ng repeat in AngularJS

[step3]AngularJS: Multiplying Two Numbers within an Object and then Obta...

Getting Started with ASP NET MVC 5 | Visual Studio 2015

google3ad02394ad7ed45e

google-site-verification: google3ad02394ad7ed45e.html

[step2]AngularJS Initialization Demo with init

[Part1]AngularJS-Your First AngularJS App

display running time in jquery

Clone(Copy) Dropdown List with Selected Value using jQuery

how to change image on mouseover or hover using jquery

check if string contains specific text using jQuery

jQuery Convert/Split comma separated string to array

jQuery Add Insert Items into Array List with Example

How to get a specific child divs value from parent using jquery

how to disable right click menu in html page using jquery

Disable right click on image using jquery

jQuery Check DIV Contains Content Data or Not

How to Check a Checkbox is Checked or Not Using jQuery

Show Alert Message while leaving(closing) from webpage using jquery or j...

jQuery Image preview before upload Image

How to detect browser type

Jquery-How can I check checkboxes based on values?

Google Maps API V3 Add Click Event Listener to Marker in Google Maps Ex...

Google Map Api Get Latitude and Longitude from Address in JavaScript

JavaScript Regular Expression to Replace Escape Special Characters from ...

JavaScript Get Date of 30 Days Prior Ago to Current Date Example

jQuery Disable Submit Button After Click to Avoid Duplicate Form Submission

Add Border to Image or CSS Add Border to Images in Webpage

jQuery UI DatepickerCalendar Using in Master and Content Page Example in...

Set Date Format in JavaScript dd/mm/yyyy hh:mm:ss Example

add in header----

[Step 2]create and implementing service

How to clear the content of a div using jquery

What is Chaining and how to do chaining in jQuery?

how to append li in ol and text in paragraph using jquery

Adding your own callbacks to existing Jquery functions

Change or set paragraph text,html and value of textbox dynamically with ...

stop,stop all,stop but finish animate jquery

Need to increase height & width of jquery dialog with animate function

jquery toggle animate height only

What is the difference between jQuery: text() and html() ?

Fetching textbox value at button click JQuery

How to get anchor text/href on click using jQuery?

height width reposition in animate jquery

slide down menu jquery

jQuery slideToggle, show/hide speed

applying stop to slidedown jquery

jQuery slideUp to show the element

fadetoggle in jquery

fadeto in jquery

mousedown in jquery | mouse release jquery

jQuery hover Method show alert message

jQuery on function on click event

How to get the focused element with jQuery

show alert message on mouse leave in label,text,span,paragraph etc in jq...

show alert message on mouseenter in paragraph,label etc in jquery

Hide paragraph on click event method in jquery

Selects all odd 'tr' elements using jquery selectors

Selects all 'a' elements with a target attribute value NOT equal to ' bl...

Selects all 'a' elements with a target attribute value equal to ' blank'...

Selects all elements with an href attribute using jQuery Selectors

Select only first li element of every ul in jquery

Selecting only first level li element of the first ul in jquery

select first paragraph in paragraphs using (p:first selectors) in jquery

Selects all p,h2 elements with class using jquery

hide paragraph on button click using jquery google cdn library

drag row from one grid view to another gridview using jquery

Open ( Show ) jQuery UI Modal Dialog Popup Window on Page Load

In this article I will explain how to create Modal Popup Window using jQuery UI Modal Dialog in ASP.Net and how to open the modal popup as soon as page loads in browser.



Styles:

<style type="text/css">
#overlay {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-color: #000;
filter:alpha(opacity=70);
-moz-opacity:0.7;
-khtml-opacity: 0.7;
opacity: 0.7;
z-index: 100;
display: none;
}
.cnt223 a{
text-decoration: none;
}
.popup{
width: 100%;
margin: 0 auto;
display: none;
position: fixed;
z-index: 101;
}
.cnt223{
min-width: 600px;
width: 600px;
min-height: 150px;
margin: 100px auto;
background: #f3f3f3;
position: relative;
z-index: 103;
padding: 10px;
border-radius: 5px;
box-shadow: 0 2px 5px #000;
}
.cnt223 p{
clear: both;
color: #555555;
text-align: justify;
}
.cnt223 p a{
color: #d91900;
font-weight: bold;
}
.cnt223 .x{
float: right;
height: 35px;
left: 22px;
position: relative;
top: -25px;
width: 34px;
}
.cnt223 .x:hover{
cursor: pointer;
}
</style>

Scripts:
<script type="text/javascript" src="http://code.jquery.com/jquery-1.8.2.js"></script>
<script type="text/javascript">
    $("document").ready(function () {//if use ready,function will in page load
        var overlay = $('<div id="overlay"></div>');
        overlay.show();
        overlay.appendTo(document.body);
        $('.popup').show();
        $('.close').click(function () {//this is trigger when close button click
            $('.popup').hide();
            overlay.appendTo(document.body).remove();
            return false;
        });
    });
</script>

Body Container:

<div class="cnt223">
<!-- Before next step i planning to add my custom css and jquery library link i have my style if you want to downdload please check in description -->
<img src="images/close.png" alt="quit" class="x" id="x" />
<p>
This is the popup using css and jquery script...
<br /><br />
</p>
<a class="close" href="#" >Close</a>
</div>

</div>