jQuery对话框IE7问题

时间:2010-10-26 23:06:08

标签: jquery jquery-ui dialog modal-dialog titlebar

我在IE7中的标题栏宽度方面遇到问题。使用宽度打开时的第一个对话框功能:'auto'标题栏不会在整个对话框窗口中延伸。使用minWidth的第二个函数可以工作,但更像是width属性,而且内容的大小不会增加。有任何想法吗?

不工作:

        $(dialogId).dialog({
            autoOpen: 'false',
            modal: true,
            draggable: false,
            resizable: false,
            buttons: buttons,
            title: title,
            width: 'auto',
            open: function(){
                /* IE HACK */
                $buttonPane = $(this).next();
                $buttonPane.find('button:first').addClass('accept').addClass('action');
                $('.ui-dialog-titlebar-close').hide();
                $('.ui-dialog').addClass('open_dialog');
                $(this).css('overflow','hidden');// IE hack
                onOpen;
            },
            close: function(){
                $('.ui-dialog').removeClass('open_dialog');
                afterClose;
            }
        });

工作(仅作为固定宽度):

        $('#conf_dialog').dialog({
            dialogClass: dialogclass,
            autoOpen: 'false',
            modal: true,
            draggable: false,
            resizable: false,
            buttons:buttons,
            title:title,
            minWidth: 255,
            open: function(){
                /* IE HACK */
                $buttonPane = $(this).next();
                $buttonPane.find('button:first').addClass('accept').addClass('action');
                $('.ui-dialog-titlebar-close').hide();
            },
            close: afterClose
        });

2 个答案:

答案 0 :(得分:2)

理论上宽度:不支持auto,但它似乎在IE8和FF中工作,但在IE7上不起作用

我遇到了这个链接:

http://ovaraksin.blogspot.com/2011/05/jquery-ui-dialog-with-auto-width-and.html

并对其进行了调整:

       $("#myDialog").dialog({ autoOpen: false,
            width: 'auto',
            height: 'auto',
            modal: true,
            title: 'ABC...' 
        }).bind("dialogopen", function (event, ui) {

            // fix for width:auto in IE  
            var contentWidth = $(this).width();
            $(this).parent().find('.ui-dialog-titlebar').each(function () {
                $(this).width(contentWidth);
            });

        }).bind("dialogclose", function (event, ui) {
            //fix for width:auto in IE 
            $(this).parent().css("width", "auto"); 
        });

答案 1 :(得分:1)

如果您根本没有定义宽度会发生什么? 你试过宽度:100%?