I'm working with simple modal, and I'm trying to prevent the close on escape. This says it should be simple, but this doesn't work for me, am I putting this in the wrong place?
$(document).ready(function(){
$("#login_modal").modal({
overlayCss: {
backgroundColor: '#000',
},
containerCss: {
height: 485,
width: 385,
backgroundColor: "#f6f6f6",
border: '3px solid #d3d5d6',
fontSize: '10pt',
color: '#58595b',
fontFamily: 'sans-Serif',
fontWeight: '100',
paddingLeft: 5,
paddingTop: 5,
opacity: .94,
escClose: false,
},
onOpen: function (dialog) {
dialog.overlay.fadeIn('slow');
dialog.data.show();
dialog.container.fadeIn('slow', function () {
$('body').css('overflow', 'hidden');
});
},
onClose: function (dialog){
$('body').css('overflow', 'auto');
dialog.container.fadeOut('200');
dialog.overlay.fadeOut('200', function () {
$.modal.close();
});
},
});
});
Yes, escClose
is in the wrong place - it's a parameter on the modal itself, not the containerCss
array. You also have extra commas at the end of your overlayCss
and containerCss
property arrays. This sometimes causes issues in browsers. Try this;
$(document).ready(function(){
$("#login_modal").modal({
escClose: false,
overlayCss: {
backgroundColor: '#000'
},
containerCss: {
height: 485,
width: 385,
backgroundColor: "#f6f6f6",
border: '3px solid #d3d5d6',
fontSize: '10pt',
color: '#58595b',
fontFamily: 'sans-Serif',
fontWeight: '100',
paddingLeft: 5,
paddingTop: 5,
opacity: .94
},
onOpen: function (dialog) {
dialog.overlay.fadeIn('slow');
dialog.data.show();
dialog.container.fadeIn('slow', function () {
$('body').css('overflow', 'hidden');
});
},
onClose: function (dialog){
$('body').css('overflow', 'auto');
dialog.container.fadeOut('200');
dialog.overlay.fadeOut('200', function () {
$.modal.close();
});
},
});
});