jQuery qTip relative path for image source

Question

Hi I have a jQuery qTip tooltip in my web app and I am trying to set a relative path for an image in the tooltip.

The code I have is:

$('#behind-the-behaviour span[title]').qtip({
                content: { title: { text: "Behind the Behaviour" }, text: "<img src='~/Images/behindbehaviour.png'/>" },
                style: { border: { radius: 5 } },
                show: { effect: function () { $(this).show(); } },
                hide: { effect: function () { $(this).hide(); } },
                position: { my: 'rightTop ', at: 'left center', target: this, viewport: $(window) },
            });

It needs to be relative as this is a master page that is inherited by pages in different folders. When the path is set to just 'Images/behindbehaviour' the foldered pages can't access it

How do I make the jquery find the images through the relative path? Thanks!

Answer 1

Try:

text: "<img src='/Images/behindbehaviour.png'/>"

without the tilde (~)

That works for me.