相关疑难解决方法(0)

由于许多网站都在利用jQuery UI,因此有一些主要的缺点需要克服,因为jQuery UI不支持响应式设计,并且maxWidth在与之结合使用时存在长期存在的错误width:'auto'.

所以问题仍然存在,如何使jQuery UI Dialog响应？

我创建一个div,然后在对话框中打开它.我尝试了这个div的样式,以实现内容在两个方向上扩展到100%.

到目前为止我尝试了什么:设置div风格

#content {
    width:auto !important;
    height:auto !important;
    background-color:red !important;
    display:block !important;
}

并设置默认的div样式

$(div).dialog({ dialogClass: 'someStyle' });

.someStyle .ui-dialog-content 
{
    height:auto !important;
    display:block !important;
}

似乎什么都没有用!我重写宽度属性但不能覆盖高度属性.怎么破解这个？

我希望实现这样的目标:http://jsfiddle.net/S3FQv/

我打开jquery ui对话框并在其中加载一些内容.但是当我调整浏览器时,jq对话框不会改变它的宽度/高度.我尝试了一些但没有运气.我在这里打开它:

$(document).ready(function () {
    var wWidth = $(window).width();
            var dWidth = wWidth * 0.9;
            var wHeight = $(window).height();
            var dHeight = wHeight * 0.9;

            $(".openDialog").live("click", function (e) {
                e.preventDefault();
                $("<div></div>")
                    .addClass("dialog")
                    .attr("id", $(this).attr("data-dialog-id"))
                    .appendTo("body")
                    .dialog({
                        title: $(this).attr("data-dialog-title"),
                        close: function () { $(this).remove() },
                        modal: true,
                        resizable: false,
                        show: 'fade',
                        width: dWidth,
                        height: dHeight,                    
                        create: function (event, ui) {
                            $(this).parents(".ui-dialog:first").find(".ui-dialog-titlebar").css("display", "none");

                            $(this).parents(".ui-dialog").css("padding", 0);
                            $(this).parents(".ui-dialog").css("border", 0);
                            $(this).parents(".ui-dialog:first").find(".ui-dialog-content").css("padding", 0);

                            $(this).parents(".ui-dialog:first").find(".ui-dialog-content").css("background", "#000000");
                            $(this).parents(".ui-dialog:first").find(".ui-dialog-content").css("overflow", "hidden");

                        }  

                    })
                    .load(this.href);
            });
$(window).resize(function () {
            var wWidth …