2013-11-02 3 views
2

Я работаю с оповещениями о загрузке. Его работает нормально, но после загрузки предупреждений прокрутки моего браузера стали исчезает, и я не могу прокручивать мою страницуBootstrap Bootbox удаление браузера полосы прокрутки после загрузки alertbox

bootbox.dialog({ 
     closeButton:false, 
     message: "Do you clear all contents?", 
     title: "Are you sure to clear all contents?", 
     buttons: { 

     main: { 
      label: "Cancel", 
      className: "btn-primary btn-small", 
      callback: function(result) { 

      } 
     }, 
     danger: { 
      label: "Clear!", 
      className: "btn-danger btn-small", 
      callback: function(result) { 
      // clear contents from here 
      content_id.find(".canvas_frame").html(""); 

      $(".sidebar").find(".tbProperties").hide(); 
      showtbBoxpanel(); // $(".sidebar").find(".tbBoxpanel").show(); 

      } 
     } 

     } 
    }); 
+0

У меня аналогичная проблема. Полоса прокрутки исчезает, поэтому содержимое переходит вправо, но затем, когда полоса прокрутки снова появляется, но содержимое не возвращается назад, пока я не закрою Bootbox. Их пример не делает этого. –

ответ

5

Try Добавляя это в CSS:

<style> 
.modal{ 
    direction:rtl; 
    overflow-y: auto; 
} 

.modal .modal-dialog{ 
    direction:ltr; 
} 

.modal-open{ 
    overflow:auto; 
} 
</style> 
+2

Не совсем уверен, почему используется '' direction''. Это заставляет мою полосу прокрутки идти в левую сторону страницы. Просто удалить его из '' .modal'' и полностью удалить «.modal .modal-dialog'' сделал для меня обаяние. –

0

Попробуйте CSS

.modal-open{ 
    overflow: hidden !important; 
    padding: 0px !important; 
} 
.modal-open .modal{ 
    overflow: hidden !important; 
} 
0

Он решил мою проблему:

body 
{ 
    overflow-y: scroll !important; 
} 

body.modal-open, .modal-open .navbar-fixed-top, .modal-open .navbar-fixed-bottom { 
    margin-right: 0; 
} 

.bootbox.modal { 
    overflow:hidden !important; 
} 
-2
@{ 
    ViewBag.Title = "Index"; 
} 

<br /> 
<h2>Index</h2> 

<p> 
    Some Content Here.....<br /> 
    .....<br /> 
    .....<br /> 
    .....<br /> 

    <a id="alert" href="#">Alert!</a> 
</p> 

@section Scripts{ 
    @*If working with bootbox.min.js and Asp.Net MVC 5 (this worked; no scrollbar and no shifting)*@ 
    <style type="text/css"> 
    body { 
     overflow-y: hidden !important; 
    } 

    body.modal-open, .modal-open .navbar-fixed-top, .modal-open .navbar-fixed-bottom { 
     margin-right: 0; 
    } 

    .bootbox.modal { 
     overflow: hidden !important; 
    } 
</style> 


<script type="text/javascript"> 

    $(document).on("click", "#alert", function (e) { 
     bootbox.alert("Hello world!", function() { 
      console.log("Alert Callback"); 
     }); 
    }); 
</script> 
} 

 Смежные вопросы

  • Нет связанных вопросов^_^