Trying to make work Qtip2 with WordPress

0 Views

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

Read More

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.

Post Views: 0

Related posts