it-swarm.com.ru

Как вы можете отключить полосы прокрутки в диалоговом окне jQuery UI?

Кто-нибудь знает, есть ли способ отключить полосы прокрутки в диалоговом окне jquery? Содержимое, которое у меня есть в div, составляет 300 пикселей, но в диалоговом окне установлено значение 200 пикселей Он автоматически ставит полосы прокрутки, но я не хочу их. Я добавлю это сам ко второму div, который делает его больше, чем окно. Любая помощь приветствуется.

31
ngreenwood6

Вы имеете в виду виджет диалогового окна jQuery UI ?

Вы можете передать опцию при ее создании, чтобы указать ее высоту, например,.

$('.selector').dialog({ height: 350 });

Сделайте его выше, чем содержимое, которое вы помещаете в него, и я подозреваю, что вы будете золотыми.

11
Paul D. Waite

Я решил проблему следующим образом:

.dialog({
  title: $(this).attr("data-dialog-title"),
  closeOnEscape: true,
  close: function () { $(this).remove() },
  draggable: true,
  position: 'center',
  width: 500,
  height: 'auto',
  modal: true,
  open: function (event, ui) {
    $('#myDialogId').css('overflow', 'hidden'); //this line does the actual hiding
  }
});
67
MUG4N

Я не знаю точно, что вы подразумеваете под "диалоговым окном jquery", но стандартным способом отключения полос прокрутки было бы установить свойство переполнения div на "скрытый"

поместите это в свой файл CSS:

div.class_name {
  overflow: hidden;
}
6
Paul Woolcock

Переполнение: скрытое сработало для меня. При настройке только параметров высоты/ширины полосы прокрутки будут по-прежнему отображаться в зависимости от размера текста и масштаба.

3
DoctorEJB

Решение без CSS или с фиксированной высотой :

Я думаю, что лучшее решение вышеупомянутой проблемы - сделать динамическую высоту диалога, высота должна регулироваться автоматически в соответствии с контентом, когда контент увеличивается, модальная высота должна увеличиваться. Чтобы сделать это, используйте опцию высоты "auto", предоставляемую модальным интерфейсом Jquery, она регулирует модальную высоту в соответствии с содержимым, поэтому необходимо добавить "overflow: hidden" или "height: 350".

$( "#dialog" ).dialog({
modal : true,
height:"auto"

}); 
2
Sanjeev

Это убрало полосы прокрутки:

$( "#dialog" ).dialog({
    autoOpen: false,
    resizable: false,
    dialogClass: 'info',
    height: 'auto',
    width: 'auto',
    show: { effect: "blind", duration: 1000 },
    hide: {effect: "explode", duration: 1000 },
    draggable: true,
    open: function (event, ui) {
        $(this).dialog('open');
    },
    close: function (event, ui) {
        cleanup() ;
    }
});
1
smac2020

В приведенном ниже примере я также добавил "resizable = false" для диалога. Так что любой текст переполнения не может быть виден путем изменения размера диалога.

$("a#registerServerStudio , a#regServer").click(function(e) {
    //alert("login using POST is Clicked");
    e.preventDefault();
    registerSuccess = false;

    regSSDlg = $("#regSS").dialog({
      autoOpen: false,
      height: 280,
      width: 420,
      modal: true,
    resizable: false,
      buttons: {
      },
      close: function() {
        registerSuccess = false;
      },
    show:{effect:'bounce', duration: 100},

    });
  $('#regSS').css('overflow', 'hidden');
    regSSDlg.prev(".ui-dialog-titlebar").css({"background":"#47669E", "color":"white", "font-size":"13px", "font-weight":"normal"}) ;

    regSSDlg.dialog("open");
});
0
Rahul Varadkar