CODEWITHSUNDEEP
javascriptjquerycssmodal-dialog
Sebbie
Sebbie

Reputation: 117

How do I work around to close this modal?

So, I've been trying to play with the js on this codepen so that when you click the background, it closes the modal... But, I have two problems:

  1. .modal is contained within .modal-background
  2. I'm such a shameful noob that I can't seem to find a workaround.

Could you guys help? Anything so I can learn and fix :)

Here below is the js code:

$('.button').click(function(){
  var buttonId = $(this).attr('id');
  $('#modal-container').removeAttr('class').addClass(buttonId);
  $('body').addClass('modal-active');
})

$('#modal-container').click(function(){
  $(this).addClass('out');
  $('body').removeClass('modal-active');
});

Thanks! :D

Upvotes: 1

Views: 52

Answers (1)

Louys Patrice Bessette
Louys Patrice Bessette

Reputation: 33933

If your question is about how to prevent the modal to close on a direct click on it, but keeping a click on the background to close it (Like if you want to insert a button or anything into it)...

This will do:

$(".modal").click(function(){
    return false;
});

Upvotes: 1

Related Questions