如何在jQuery UI对话框中禁用滚动条?

时间:2009-10-25 02:10:17

标签: jquery jquery-ui dialog scroll

有没有人知道是否有办法在jquery对话框中禁用滚动条?我在div中的内容是300 px,但对话框设置为200px。它自动放置滚动条但我不想要它们。我将自己添加到第二个div,它使它比窗口大。任何帮助表示赞赏。

7 个答案:

答案 0 :(得分:67)

我解决了这个问题:

.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
  }
});

答案 1 :(得分:11)

您的意思是jQuery UI dialog widget吗?

您可以在创建选项时传递选项以指定其高度,例如

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

让它比你投入的内容更高,我怀疑你是金子。

答案 2 :(得分:6)

我不确切地知道'jquery对话框'的含义,但禁用滚动条的标准方法是将div的overflow属性设置为'hidden'

把它放在你的css文件中:

div.class_name {
  overflow: hidden;
}

答案 3 :(得分:3)

溢出:隐藏为我工作。仅设置高度/宽度参数时,滚动条仍然会出现,具体取决于文本大小和缩放。

答案 4 :(得分:2)

没有css或固定高度的解决方案:

我认为上述问题的最佳解决方案是使对话高度动态,高度应根据内容自动调整,当内容增加时模态高度应增加。 为此,请使用Jquery UI模式提供的高度“自动”选项,它根据内容调整模态高度,因此需要添加'overflow:hidden'或'height:350'

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

}); 

答案 5 :(得分:1)

这删除了滚动条:

$( "#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() ;
    }
});

答案 6 :(得分:0)

在下面的示例中,我还添加了' 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");
});