2012-04-20 1 views
3

В настоящее время я использую тему REDMOND в своем приложении и вам нужно использовать тему THEMEROLLER только для подсказок qtip2. Поскольку я определил всплывающую подсказку как виджет, он должен использовать themeroller их. Что я не могу решить, так это то, как & где добавить файл cseroller css в файл javascript.Использование темы themeroller в qtip2

Пожалуйста, помогите.

В 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" /> 

The файлов JavaScript в конце моего файла Js являются:

<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 
    } 
}); 
+0

Вы решили свою проблему? Если нет, предоставьте мне больше информации, потому что я не понимаю вашу проблему :) – Neysor

ответ

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) 
    } 
})