How to remove the shading (backdrop) of a modal in Bootstrap and free the remaining area of the page?

Asked

Viewed 1,186 times

3

I’m having trouble removing that shadow that sits around a Bootstrap modal. With the code below I can remove:

#myModal .modal
{
    overflow: hidden;
}

However, I cannot manipulate anything that is "behind", even if the overflow. The screen is "free" (occupies only the space of the modal), but I cannot, for example, select a text that is on the same page (outside the modal).

twitter-bootstrap

2 answers

3

to remove the fade behind the modal

.modal-backdrop.in{
  display: none;
}

to enable page overflow again

.modal-open{
  overflow: visible;
}

to unbox the modal click, include in the modal opening call the parameters backdrop and keyboard

//desabilita o click fora e o fechar pelo esc
jQuery('#myModal').modal({backdrop: 'static', keyboard: false});

1


Thanks for the contribution, but I did not get the way you indicated. I did so:

#myModal.modal-backdrop{
    display: none;
    }

#myModal.modal{
    bottom: inherit;
    }

It worked that way.

  • I’m glad it worked... to illustrate what I said, I put in this link.

  • I had put an extra class on modal-backdrop, maybe that’s what didn’t work... in the example is already right...

  • Thank you @h3nr1ke

Browser other questions tagged twitter-bootstrap

You are not signed in. Login or sign up in order to post.