Trying to make work Qtip2 with Wordpress

248 views Asked by At

I tried to make work Qtip2 qith Wordpress, without any success.

I read the following tutorial : http://craigsworks.com/projects/forums/showthread.php?tid=3371

So here is how I load the Qtip javascript part :

    /* FH Frontend */
    wp_enqueue_script('fh-front', plugin_dir_url() . 'fh-plugin/scripts/fh-front.js', array('jquery', 'qtip'));

    /* Qtip */
    wp_enqueue_style('qtip',  get_stylesheet_directory_uri() . '/assets/qtip/jquery.qtip.min.css', null, false, false);

    // Using imagesLoaded? Do this.
    wp_enqueue_script('imagesloaded', get_stylesheet_directory_uri() . '/assets/qtip/imagesloaded.min.js', null, false, true);
    wp_enqueue_script('qtip',  get_stylesheet_directory_uri() . '/assets/qtip/jquery.qtip.min.js', array('jquery', 'imagesloaded'), false, true);

Now, here is the content of fh-front.js:

(function($) {

    $(document).ready(function() {
            $('a[title]').qtip();
    });

})(jQuery);

So with this code, I would like to add a tooltip over the following link :

<a href="#" class="myFirstQtip" title="foo">Hover over me</a>

But... it doesn't work... What I don't understand is that the Qtip plugin seems to work because the displayed HTML code looks like this :

<a href="#" class="myFirstQtip" data-hasqtip="0" oldtitle="foo" title="" aria-describedby="qtip-0">Hover over me</a>

Here is a link to Jfiddle to expose the situation : http://jsfiddle.net/z39an8a4/

I confirm all required all JS codes are loaded with success.

So, any idea for the issue ?

Thank you, K.A.

0

There are 0 answers