在jQuery UI对话框上设置圆角

前端之家收集整理的这篇文章主要介绍了在jQuery UI对话框上设置圆角前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
我正在使用 jquery对话框插件,默认是标题栏的所有4个角落四舍五入.您可以看到该对话框在这里生成标记

http://jqueryui.com/demos/dialog/#theming

在这个例子中,你可以看到ui-dialog-titlebar上有一个叫ui-corner-all的类,我想把它改成ui-corner-top.当我启动对话框时,有没有办法设置圆角类的类型?

编辑jquery UI对话框javascript文件有一个很奇怪的选择,让该类总是在那里,但似乎不够灵活.

谢谢

解决方法

你不应该改变jquery ui库来做到这一点.想像一下,每次你想升级它时都必须改变它.

jQuery UI小部件实现了Widget Factory.当小部件被初始化时,触发事件“创建”.使用此事件可以更改生成标记

$( "#dialog" ).dialog({
    create: function(e,ui) {
        // 'this' is #dialog
        // get the whole widget (.ui-dialog) with .dialog('widget')
        $(this).dialog('widget')
            // find the title bar element
            .find('.ui-dialog-titlebar')
            // alter the css classes
            .removeClass('ui-corner-all')
            .addClass('ui-corner-top');
    }
});

DEMO

原文链接:https://www.f2er.com/jquery/176255.html

猜你在找的jQuery相关文章