Qtip工具提示不起作用

晕！我是JQuery的新手，我试图用QTip做简单的工具提示。我确定我已经按照正确的步骤进行了操作，但工具提示似乎不起作用。下面的代码：Qtip工具提示不起作用

<script type="text/javascript"> 
$(document).ready(function() { 
    $('.select-here').qtip({ 
     content: { 
      text: 'tooltip here', 
      show: 'mouseover', 
      hide: 'mouseout' 
     },  
     style: { 
      width: 400, 
      height: 400 
     } 
    }); 
}); 
</script>

和身体我写这篇

<div class="select-here">Text text text</div>

我错过了什么？任何人都可以帮助我呢？谢谢

来源

2012-11-18 paulfah

你添加了CSS，也没有你检查它与图像正确引用？ –

您在浏览器控制台中获得什么样的输出？ – Stuart

@KundanSinghChouhan是的我已经添加了css并且它正确地引用了类 – paulfah

试试这个演示：演示http://jsfiddle.net/Tdh4a/

http://craigsworks.com/projects/qtip/demos/content/basic

我想show and hide是独立的属性，而不是内容的小孩：点击这里在文档：http://craigsworks.com/projects/qtip/docs/reference/#content

而且你会发现在qTip链接中，他们正在推广qTip2而不是qTip作为它的Obsolete。休息演示应该有助于你的事业。 B-)

代码

$(document).ready(function() { 

    $(".select-here").qtip({ 
     content: { 
      text: "HULK Me HULK HULK", 
      title: { 
       text: "Title", 
       button: true 
      } 
     }, 
     show: { 
      event: 'click', 
      solo: true 
     }, 
     hide: { 
      fixed: true, 
      event: 'unfocus' 
     }, 
     position: { 
      target: 'mouse', 
      viewport: $(window), 
      adjust: { 
       method: 'flip shift', 
       mouse: false 
      } 
     }, 
     style: { 
      tip: false, 
      widget: false 
     } 
    }); 


});

来源

2012-11-18 08:01:12

Qtip工具提示不起作用

回答

相关问题