jquery qtip2 - 同一个目标的多个qtips？

Question

我使用jQuery qtip2创建鼠标悬停qtip..here是代码：

$(document).ready(function() { 
    $("#optionalProdsImgPreview_1").qtip({ 
     content: "<img src='http://mysite.com/myimg.jpg' width='100' height='150' />", 
     show: { 
      solo: true 
     }, 
     hide: { 
      delay: 400, 
      fixed: true, 
      event: "mouseout" 
     }, 
     style: { 
      tip: { 
      corner: "rightMiddle" 
      }, 
      classes: "ui-widget-content" 
     }, 
     position: { 
      adjust: { 
      x: -18, 
      y: 0 
      }, 
      at: "left center", 
      my: "right center" 
     } 
    }); 
    }); 

当鼠标在链接诸如此基本上，这将打开一个预览图像：

<a href="#" id="optionalProdsImgPreview_1">My great product here</a> 

现在我想要做的是当有人点击该链接时打开不同的qtip。此外，鼠标悬停qtip也应该关闭。我只是通过jquery .click来做到这一点，或者我应该通过其他方法来做到这一点，或者qtip可以实现这一点吗？

谢谢

Answer 1

没关系。我自己想出了解决方案。

http://craigsworks.com/projects/qtip2/tutorials/advanced/#multi

这里是我的全码：

$(document).ready(function() { 
    $("#optionalProdsImgPreview_1").qtip({ 
     content: "<img src='http://mysite.com/myimg.jpg' width='100' height='150' />", 
     show: { 
      solo: true 
     }, 
     hide: { 
      delay: 400, 
      fixed: true, 
      event: "mouseout" 
     }, 
     style: { 
      tip: { 
      corner: "rightMiddle" 
      }, 
      classes: "ui-widget-content" 
     }, 
     position: { 
      adjust: { 
      x: -18, 
      y: 0 
      }, 
      at: "left center", 
      my: "right center" 
     } 
    }) 
    .removeData('qtip') 
    .qtip($.extend({}, shared, { 
     content: "My New Content is HERE!" 
    })); 
    }); 

Answer 2

该解决方案可现在有qTip2的最新版本的改变。为了让多个qTips在同一个目标上工作，我必须在第二个qtip上添加覆盖：false选项。

http://qtip2.com/options#core.overwrite