2015-06-11 4 views
0

Я пытаюсь применить стиль, используя параметр стиля в qtip, как указано в документации styling demo, но не влияет на мой код, переопределяя его jquery.qtip.min.css класс для укладки. есть ли какой-либо способ, которым я пользуюсь, но приоритет должен быть задан для вариант стиля.Невозможно применить стили с помощью опции «style» в qtip

вот мой код для справки

HTML код:

<div id="styleChange1" class="innerDiv">Hover to get styled qtip</div> 

код расслоение плотной:

$(document).ready(function() { 
    $("#styleChange1").on({ 
      mouseover: function() { 
       ShowQtip(element1,"bottomMiddle","bottomMiddle","topMiddle") ; 
      }, 
      mouseleave: function() { 
       $(this).qtip("destroy"); 
      } 
    }); 
}); 

function ShowQtip(element,contentTxt,position1,position2) { 
    if(element == null) 
     return 
    element.qtip({ 
     content: contentTxt, 
     show: true, 
     position: { 
      my: position1, // Position my top left... 
      at: position2 
     }, 
     hide: { 
      event: false 
     }, 
     style: { 
      width: 200, 
      padding: 5, 
      background: '#A2D959', 
      color: 'black', 
      textAlign: 'center', 
      border: { 
      width: 7, 
      radius: 5, 
      color: '#A2D959' 
     }, 
     tip: contentTxt, 
     name: 'dark' // Inherit the rest of the attributes from the preset dark style 
    }); 
} 

Пожалуйста, любое предложение было бы большим подспорьем.

+0

здесь скрипку для кода выше https://jsfiddle.net/6kqqr05g/ –

ответ

0

Попробуйте использовать этот код ...

$("jqueryselector").qtip({ 
    content: 'Stems are great for indicating the context of the tooltip.', 
    style: { 
     tip: { // Now an object instead of a string 
     corner: 'topLeft', // We declare our corner within the object using the corner sub-option 
     color: '#6699CC', 
     size: { 
      x: 20, // Be careful that the x and y values refer to coordinates on screen, not height or width. 
      y : 8 // Depending on which corner your tooltip is at, x and y could mean either height or width! 
     } 
} } }); 
+0

спасибо, я уже пробовал это, но никаких изменений, может у редактировать свою скрипку и обновить изменения –