Scroll bug when opening a modal on top of another

Asked

Viewed 866 times

0

When I click on Menus link http://www.escolatarsiladoamaral.com.br/home (goes to the restricted area, login: admin and password: admin) it opens a modal usually, with the scrolling and everything, everything right. When I click to view one of the menus it opens another modal and it gets right too.

The problem is when I close this modal view menu; the lower modal is no longer scrolled, and you can’t see all its content. It seems that the scrolling is only for the current modal.

I think it’s something in his HTML/CSS, because this code was not made by me and is in Cakephp, a framework that I’m not familiar with.

html css modal

  • Apparently when you close the modal o bootstrap.min.js of the one toggle in class modal-open of <body>. Try to put some flag when he opens the modal and check if it is active when closing...

2 answers

4

As already indicated by Vitorluizc, when bootstrap opens a modal it inserts in the page’s body tag the modal-open class (also responsible for scrolling the page), when it closes the modal it removes the class without analyzing if there is another open modal, in this case when closing the second modal(opened last) it must re-insert the modal-open class in the body; I resolved in this way:

$('seletor_segundo_modal').on('hidden.bs.modal', function(e){
  $("body").addClass("modal-open");
});

  • I used it like this: $("#modal-segundo-que-dar-error").on("hidden.bs.modal", function() {&#xA; $("body").addClass("modal-open");&#xA; }); Ai solved the problem :)

0

Try using the nicescroll

http://areaaperta.com/nicescroll/

I’m not sure I understand your question, but you can add the overflow by js. 

$(document).ready(

  function() { 
    $(".divcomheight").niceScroll();
  }

);
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>

Try to use, anything can perform the function after 100 ms with settimeout.

Browser other questions tagged html css modal

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