有没有可能打开一个jQuery UI对话框没有标题栏?
当前回答
下一种形式解决了我的问题。
$('#btnShow').click(function() { $("#basicModal").dialog({ modal: true, height: 300, width: 400, create: function() { $(".ui-dialog").find(".ui-dialog-titlebar").css({ 'background-image': 'none', 'background-color': 'white', 'border': 'none' }); } }); }); #basicModal { display: none; } <script src="http://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.10.3/jquery-ui.min.js"></script> <link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.10.3/themes/smoothness/jquery-ui.css" /> <div id="basicModal"> Here your HTML content </div> <button id="btnShow">Show me!</button>
其他回答
这对我隐藏对话框标题栏有用:
$(".ui-dialog-titlebar" ).css("display", "none" );
我相信你可以用CSS隐藏它:
.ui-dialog-titlebar {
display: none;
}
或者,你可以使用dialogClass选项将其应用于特定的对话框:
$( "#createUserDialog" ).dialog({
dialogClass: "no-titlebar"
});
.no-titlebar .ui-dialog-titlebar {
display: none;
}
看看“主题化”对话。上面的建议使用了dialogClass选项,该选项似乎正在被一种新的方法取代。
对我来说,我仍然想使用重新调整大小的角,只是不想看到对角线。我使用
$(".ui-resizable-handle").css("opacity","0");
我刚意识到我回答错问题了。不辜负我的名字:(
我发现使用open事件并从那里隐藏标题栏更有效,更可读。我不喜欢使用页全局类名搜索。
open: function() { $(this).closest(".ui-dialog").find(".ui-dialog-titlebar:first").hide(); }
简单。
我认为最好的解决方案是使用选项dialogClass。
jquery UI文档的一个摘录:
在init: $('.selector')期间。dialog({dialogClass: 'noTitleStuff'});
或者在init之后。:
$('.selector').dialog('option', 'dialogClass', 'noTitleStuff');
所以我创建了一些对话框选项dialogClass='noTitleStuff'和css像这样:
.noTitleStuff .ui-dialog-titlebar {display:none}
太简单了!!但是我花了1天的时间来思考为什么我之前的id->类钻井方法不起作用。事实上,当你调用.dialog()方法时,你转换的div成为另一个div(真正的对话框div)的孩子,可能是标题栏div的“兄弟”,所以很难尝试从前者开始寻找后者。
推荐文章
- 停止jQuery中的所有活动ajax请求
- 在$.ajax()中将数组传递给ajax请求
- JavaScript数据网格数百万行
- 我可以在JavaScript中获得当前运行函数的名称吗?
- 使用jQuery选择多个类
- 如何创建一个jQuery函数(一个新的jQuery方法或插件)?
- jQuery -添加额外的参数提交(不是ajax)
- 如何清除所有<div>的内容在一个父<div>?
- 如何在svg元素中使用z索引?
- 如何求一个数的长度?
- 使用jQuery获取第二个孩子
- .append(), prepend(), .after()和.before()
- 如何将JavaScript文件链接到HTML文件?
- jQuery的窗口大小调整
- 找到jQuery中所有未选中的复选框