CODEWITHSUNDEEP
javascripthtml
Panchotiya Vipul
Panchotiya Vipul

Reputation: 1296

How do I create a custom event and fire it using Javascript

My Code :.....

<html>
<head>
<script>
function demo()
{
    var win=window.open("demo.html",'_blank');
    alert('Requested Page Loaded...');
    win.focus();
}
</script>
</head>
<body>
<input type="button" value="demo" onClick="demo()"></input>
</body>
</html>

I want to close the alert event dynamically using JavaScript event. When alert is come in seen and it will close automatically using JavaScript event fire and close it..

Upvotes: 1

Views: 85

Answers (1)

TimSPQR
TimSPQR

Reputation: 2984

You could create a pseudo-alert. You can make it a modal if it is closed by a programmed event (instead of screen-triggered).

HERE is a fiddle. (click on two colors to open and close alert.

HTML

<div class='testdiv'></div>
<div class='testdiv3'></div>
<div id='dialogtest' class='testdiv2'>Alert!</div>

CSS

.testdiv {
    width: 100px;
    height: 100px;
    margin: 0px auto;
    background-color: red;
}
.testdiv3 {
    width: 100px;
    height: 100px;
    margin: 0px auto;
    background-color: green;
}

.testdiv2 {
    background-color: green;
    width: 50px;
    height: 50px;
    font-size: 15px;
}
.ui-dialog-titlebar {
    display: none;
}

JS

$( ".testdiv2" ).dialog({
                       autoOpen: false,
                          modal: false,
                         height: 50,
                          width: 'auto',
                       position: { my: "right middle",
                                   at: "left middle",
                                  of : ".testdiv" } 
                           });

$('.testdiv').click(function(){
  $('.testdiv2').dialog('open');
});
$('.testdiv3').click(function(){
  $('.testdiv2').dialog('close');
});

Upvotes: 1

Related Questions