ToolTip Won't close after click

[dschuett]

I have implemented a tooltip on my navigational links (after clicking on the 2006 Volvo 780). Found here: http://www.lonemountaintruck.com/partners/index2.php

I am pulling the "detailed" view of the truck into the div from a php file(loadtrucks.php).

The "Next Rig" link is the link that is causing the tooltip to stay open after you click it even if you click on "Pick A Different Rig" link at the top right, and it stays open until you actually reload the page. The link looks like this:

<a href=\"\" onClick=\"return false\" onmousedown=\"javascript:swapContent('alltrucks');\"><img class='effect' style='padding-bottom:5px; padding-left:8px;' src='/img/dana/next.gif' title=\"Next Rig\"></a>

I found that if I use onClick instead of onmousedown, the behavior goes away. However, then I lose the jquery slide/show effect.

Any ideas?

[stbuchok]

onmousedown of the next rig button, call the function to fadeout the tooltip before calling the function to close the popup.

[dschuett]

Thanks for the response!

I have tried adding

$('.effect').tipsy({delayOut: 1});

to the first call in the swapContent function that the onmousedown is calling, but it still doesn't seem to work. - I know "delayOut: 1" works because I have tested.

Here is what my swapContent function looks like if this helps anyone:

<script language="JavaScript" type="text/javascript">
        function swapContent(truck) {
            $('.effect').tipsy({delayOut: 1});
            $("#trucks").html('<center><img style="margin-top:50pxl" src="/img/dana/loader.gif"></center>').show();
            var url = "loadtruck.php";
            var img = new Image();
            img.src = "/img/dana/07volvo780-main.jpg";
            $.post(url, {contentVar: truck} ,function(data) {
                $("#trucks").hide();
                $("#trucks").html(data).fadeIn('slow');
                $("#info").slideto();
                $(".fancyvideo").fancybox({
                    overlayShow: true,
                    frameWidth:640,
                    frameHeight:360
                });
                $("a.fancy").fancybox({
                    overlayShow : true,
                    overlayOpacity : 0.7,
                    transitionIn : "elastic"
                });
                $('.effect').tipsy({fade: true});
            });
        }
    </script>