You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
41 lines
1.1 KiB
41 lines
1.1 KiB
5 years ago
|
<!doctype html>
|
||
|
|
<html lang="en">
|
||
|
|
<head>
|
||
|
|
<meta charset="utf-8">
|
||
|
|
<title>Dialog Visual Test</title>
|
||
|
|
<link rel="stylesheet" href="../../../themes/base/all.css">
|
||
|
|
<script src="../../../external/requirejs/require.js"></script>
|
||
|
|
<script src="../../../demos/bootstrap.js" data-modules="effect-blind effect-explode">
|
||
|
|
$( "#dialog" ).dialog({
|
||
|
|
autoOpen: false,
|
||
|
|
show: {
|
||
|
|
effect: "blind",
|
||
|
|
duration: 1000
|
||
|
|
},
|
||
|
|
hide: {
|
||
|
|
effect: "explode",
|
||
|
|
duration: 1000
|
||
|
|
},
|
||
|
|
modal: true
|
||
|
|
});
|
||
|
|
|
||
|
|
$( "#opener" ).on( "click", function() {
|
||
|
|
$( "#dialog" ).dialog( "open" );
|
||
|
|
});
|
||
|
|
</script>
|
||
|
|
</head>
|
||
|
|
<body>
|
||
|
|
|
||
|
|
<p>WHAT: A animated modal dialog, using blind effect to show, explode to hide.</p>
|
||
|
|
<p>EXPECTED: Dialog shows up on top of the overlay and stays there during and after the animation. Focus is set to the input inside the dialog and stays there after the animation finishes.</p>
|
||
|
|
|
||
|
|
<div id="dialog" title="Are you sure?">
|
||
|
|
<p>Please enter password to continue.</p>
|
||
|
|
<label for="password">Password</label><input id="password">
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<button id="opener">Open Dialog</button>
|
||
|
|
|
||
|
|
</body>
|
||
|
|
</html>
|