0

我一直在研究一些 jQuery 插件，以便在图像悬停时在图像周围显示工具提示。但我一直找不到，我正在寻找的是一个工具提示，可以在工具提示中使用相同的图像加载，并带有描述、文本和评级。

所以我在考虑自己做，想知道你们认为最好的方法是什么？

一般的想法是顶部有一排图像，当用户悬停一个图像时，会出现一个带有相同图像的圆形矩形，并将信息填充到图像的左侧。他们必须让工具提示消失，而不是缩略图。

你们知道有什么 jQuery 工具提示插件可以做到这一点吗？无需重新发明轮子。

<div class="item">
    <div class="thumbail">
        <img src="" alt="" />
    </div>

    <div class="hiddentooltipinfo">
        <div class="tooltipinfo">
            <div class="info">
                <h3>Title</h3>
                <p>Text</p>
            </div>

            <div class="rating">
                <p>85%</p>
            </div>
        </div>
    </div>
</div>
4

2 回答 2

2
  • 我还没有找到我喜欢的工具提示插件。 我自己造一个就好了。老实说，我愿意提供帮助。
  • 我建议您使用 htmlimg属性并将评级作为十进制值或带有 % 符号的百分比。两者都清楚地表明了百分比。另外，一定要包含width和height属性。
  • 我最不喜欢的插件是qTip。
<!-- You could use this as your markup: -->
<div class="item">
    <div class="thumbail">
        <img src='' width='' height='' title='' alt='' data-rating='' />
    </div>
</div>

<!-- Depending on why you have the extra markup, you could potentially
     Just use the following: -->
<img src='' width='' height='' title='' alt='' data-rating='' />
于 2011-08-04T16:30:23.567 回答
0

只需使用图像标签上的 ALT 和 TITLE 属性，如果你想要更多 jquery 有插件等很酷的工具提示..

<img src="#" alt="Submit" title="submit">

http://flowplayer.org/tools/tooltip/index.html

http://www.1stwebdesigner.com/css/stylish-jquery-tooltip-plugins-webdesign/

于 2011-08-04T16:27:59.757 回答