Question

<link rel="stylesheet" href="/js/jquery.qtip.css" type="text/css" />
<script type="text/javascript" src="/js/jquery.qtip.js"></script>
<script type="text/javascript" language="javascript">
    $(document).ready(function () {
        $('a.link').qtip({
            content: {
                text: function (api) {
                    return $(this).attr('qtip-description');
                },
                title: {
                    text: function (api) {
                        return $(this).attr('qtip-title');
                    }
                }
            },
            position: {
                my: 'bottom center',
                at: 'top center'
            },
            style: {
                classes: 'ui-tooltip-shadow ui-tooltip-light'
            }
        });
    });
</script>

<a href="#" id="linkRSS" target="_blank" class="link" qtip-title="Title" qtip-description="Description" aria-describedby="ui-tooltip-6">Link</a>

I have about 500 links on the page with text and description attributes to show inside qTip, when I hover mouse qTip appears only once, the second time I hover nothing happens, even no errors exist.

The links load when page loads, I do nothing with them after they loaded, anyways I tried to use jQuery live event, but that didn’t help.

I use jQuery 1.7.1 from google’s cdn. So what’s wrong with my code?

P.S: Woah! I just noticed that demoes on qTip site fire only once as well. I am really confused, why is it so?

Answer 1

Seems like it’s a bug of the most recent build. See https://github.com/Craga89/qTip2/issues/328.

It’s likely that it’ll be fixed soon so I would either wait for the next build or download an older build.