拥有jQuery的工具提示故障(Having Trouble with jQuery tooltip

我使用的是发现了jQuery工具工具提示插件这里。这是它的预期的行为：有3个元素，在这种情况下div s，这，点击后，弹出一个提示。这提示是通过CSS隐藏在页面上的其他股利。当它弹出，我需要它保持可见，直到上的一个用户点击div的工具提示S（或工具提示本身，如果这是不可能的内部）或者点击其他初始3个的一个div秒。

问题是：这样做时，我得到一些意外的行为。例如，第一个div你点击（无论是哪一个），它按预期工作：工具提示弹出，除非你点击它里面或其他的一个熬夜div秒。然而，老毛病又犯了时另一个div ，它一旦鼠标离开消失div区域。您还可以点击你寿没有问题，点击第一个...

我不知道什么是错在这里。 = /

下面的测试代码

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns='http://www.w3.org/1999/xhtml' xml:lang='en' lang='en' dir='ltr'>
<head>
    <title>Tool Tip Demo</title>
    <link rel='stylesheet' type='text/css' href='style/style.css' />
    <script type='text/javascript' src='jquery.js'></script>
    <script type='text/javascript' src='jquery.tools.min.js'></script>

    <style>
    .box2 {
        display: inline-block;
        margin: 5px;
        padding: 3px;
        width: 64px;
        height: 64px;
        line-height: 64px;
        background-color: green;
        text-align: center;
    }
    #tooltip { 
        display: none;
        width: 300px;
        height: 150px;
        overflow: auto;
        background-color: pink;
    }
    </style>
</head>

<body>
    <h1>Tool Tip Demo</h1>
    <script language='javascript' type='text/javascript'>
    $(document).ready(function () {
        $('.tooltip').tooltip({ 
            events: { 
                def: "click, mouseout",
                tooltip: "mouseenter, click"            
            },
            tip: '#tooltip'}).dynamic({ bottom: { direction: 'down'} });
    });
    </script>

    <div style='padding: 1em; width: 450px; margin: 0 auto;'>
            <div  class='tooltip box2'>
                Div
            </div>
            <div  class='tooltip box2'>
                Div
            </div>
            <div class='tooltip box2'>
                Div
            </div>
    </div>

    <div id='tooltip'>
            <div class='box2'>
                Div
            </div>
            <div class='box2'>
                Div
            </div>
            <div class='box2'>
                Div
            </div>
            <div class='box2'>
                Div
            </div>
            <div class='box2'>
                Div
            </div>
            <div class='box2'>
                Div
            </div>
            <div class='box2'>
                Div
            </div>
            <div class='box2'>
                Div
            </div>
            <div class='box2'>
                Div
            </div>
    </div>
</body>
</html>