代码之家  ›  专栏  ›  技术社区  ›  user90150

显示隐藏的DIV元素的jquery工具提示?

  •  0
  • user90150  · 技术社区  · 16 年前

    我正在尝试为我的个人网站提供工具提示 http://www.stacked.in . 当我在链接上移动鼠标时,我希望显示工具提示。工具提示显示内容在HTML页面中已作为DIV元素提供,但它是隐藏的。我希望工具提示只在我将鼠标移到链接上时显示。我使用jquery和jquery插件 http://bassistance.de/jquery-plugins/jquery-plugin-tooltip/ 为此目的。即使我得到了其他的jquery插件,我也会很高兴的。

    请注意,工具提示内容div inner html不会显示。工具提示应该获取并显示元素。

    #tooltip-content {
     display:none;
     width:250px;
    }
    

    这是HTML代码。

    <div id="widget" class="span-8  "  >
    
    <h2><a href="">Example.com</a></h2>
    <ul>
                <li><h3><a href="example.com">Example News 1</a></h3>
            <div id="tooltip-content">              
                <div class="published">Thu Jul 8, 2010</div>
                <div class="content">
                    This detail news 1 shown only on tooltip.. 
                </div>
            </div>
            </li>
    
            <li><h3><a href="example.com">Example News 2</a></h3>
            <div id="tooltip-content">              
                <div class="published">Thu Jul 8, 2010</div>
                <div class="content">
                    This detail news 2 shown only on tooltip.. 
                </div>
            </div>
            </li>               
       </ul>
    

    将有100多个元素需要工具提示。有更好的工具或方法来处理这个问题吗?如果你给我代码样本,我会很感激你的。我已经找了很多方法来做了。 http://code.google.com/p/jquery-very-simple-tooltip/ 接近解决方案,但它需要对所有工具提示注释进行初始化。

    1 回复  |  直到 16 年前
        1
  •  0
  •   virstulte    16 年前

    我从中找到了jquery工具 http://flowplayer.org/tools/tooltip/index.html 拥有出色的工具提示。可以在元素上使用title属性,也可以使用下一个dom节点作为无标题元素的工具提示。

    非常灵活,我相信它会适合你的需要。祝你好运!

    推荐文章