3

我目前在我的应用程序中使用 REDMOND 主题,并且只需要将 THEMEROLLER 主题用于 qtip2 工具提示。由于我已将工具提示定义为小部件,因此它应该使用主题滚轮它们。我无法决定如何以及在我的 javascript 文件中添加 themeroller css 文件的位置。

请帮忙。

头部分的css文件是:

<link rel="stylesheet" type="text/css" href="css/redmond/jquery-ui-1.8.19.custom.css" />
<link rel="stylesheet" type="text/css" href="css/jquery.qtip.min.css" />
<link rel="stylesheet" type="text/css" href="css/wms11.css" />

我的 js 文件末尾的 javascript 文件是:

<script src="js/jquery-1.7.2.min.js" type="text/javascript"></script>
<script src="js/jquery-ui-1.8.19.custom.min.js" type="text/javascript"></script>
<script src="js/jquery.qtip.min.js" type="text/javascript"></script>
<script src="js/wms11.js" type="text/javascript"></script>

我的 qtip2 语句是:

$(this).qtip({
     content: {
    text: function(api) {
        return(return_array[POPUP_HTML_STR]);
    },
    title: {
        text: function(api) {
            return(qtip_title);
        }
    }
    },
    position: {
    viewport: $(window)
    },
    style: { 
    classes: 'ui-widget ui-tooltip-rounded ui-tooltip-shadow ui-tooltip-dark',
    widget: true,
    tip: 'top center',
    width: 220,
    height: 200,
    padding: 5,
    background: 'black',
    textAlign: 'left',
    border: {
        width: 7,
        radius: 5,
        color: '#A2D959'
    },
    tip: 'top center',
    },
    show: {
    ready: true
    }
});
4

1 回答 1

2

如 P6345uk 所述,您应该设置 style.def = false 以删除 qTip2 的任何自定义样式。为我工作。

$('.selector').qtip({
    content: 'I won\'t be styled by the pages Themeroller styles',
    style: {
        widget: true, // Use the jQuery UI widget classes
        def: false // Remove the default styling (usually a good idea, see below)
    }
})
于 2013-12-19T11:52:56.373 回答