0

我试图弄清楚如何通过单击图标以及关闭它来打开工具提示。我一直在看这里的一些讨论，但似乎没有一个对我有用。这是我到目前为止所拥有的：

HTML

<span class="info">
  <img alt="aImage" src="images/aImage.png" />
  <span style="display: none;" class="stuff">something something</span>
</span>

Javascript

$(document).ready(function(){
  $(".info").tooltip({tooltipcontentclass:"stuff"})
});

为此，当然，这只会在鼠标悬停在它上面时显示工具提示，如果你将它悬停它会关闭它。我知道这并不多，但这是我能在这里做的最好的事情。请让我知道是否有通过单击打开和关闭它的方法。

4

1 回答 1

1

我认为您甚至不需要为此使用插件。一点 CSS 和 jQuery 就足够了：

$(function(){

  $(".info").click(function(){
    var left = $("img",this).offset().left + ($("img",this).width()/2) - ($(".tip", this).width()/2);
    $(".tip", this).toggle().css({"left":left});

  });

});

示例：http: //jsfiddle.net/NPXaf/

于 2013-01-18T02:20:30.973 回答