Hi all,
When the dialog box is opened, not be operated outside of it, can only operate within the dialog box?
My codes:
$(document).ready(function () {
$('.dialog').hide();$("#moveBar").mousedown(function (event) {var bMove = true;var abs_x = event.pageX - $('div.dialog').offset().left;var abs_y = event.pageY - $('div.dialog').offset().top;$(document).mousemove(function (event) {if (bMove) {var obj = $('div.dialog');obj.css({'left': event.pageX - abs_x,'top': event.pageY - abs_y});var a = $('div.dialog').offset().left + 652;if ($('div.dialog').offset().left < 0 || $('div.dialog').offset().top < 0) {obj.css('left', 0);obj.css('top', 0);}if (a >= $(window).width()) {obj.css('left', $(window).width() - 652);}}}).mouseup(function () {bMove = false;});});$('#openDialog').click(function () {$('div.dialog').show();});$('#cancel').click(function () {$('div.dialog').hide();});
});
.dialog{
position:absolute;
width:652px;
height:500px;
background-color:#F6F6F6;
border:solid 5px #5A5A5A;
}
#moveBar
{
background:#FF6600;
cursor:move;
text-align:center;
height:30px;
}
.footer
{
margin-top:350px;
background-color:#48B960;
text-align:center;
}
Move Bar
This is contents...
Thanks.

Guest UserPosted Jul 21, 2014, 2:55 AM
z-index
overlay
pls explore these