2012-04-20 17 views
3

私は現在アプリケーションでREDMONDテーマを使用していますので、qtip2ツールチップのTHEMEROLLERテーマのみを使用する必要があります。私はツールチップをウィジェットとして定義しているので、themerollerを使うべきです。私が決めることができないのは、どのように& JavaScriptファイルにthemerollerのCSSファイルを追加するかです。qtip2でthemerollerテーマを使用する

助けてください。ヘッド部で

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

問題を解決しましたか?そうでない場合、私はあなたの問題を取得しないので、より多くの情報を私に提供してください:) – Neysor

答えて

2

P6345ukで述べたように、qTip2のカスタムスタイルを削除するには、style.def = falseを設定する必要があります。私のために働いた。

$('.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) 
    } 
}) 
関連する問題