Jquery balloon not showing img


I am trying to make an extension for phpbb and in that ext there is a point where I need to show a balloon that will show a preview of a gif.

So far I’ve managed to make the balloon to appear, but my luck stops right there.

Because what ever I’ve tried I never succeeded to show an image or a proper image.

I am very new to js and jquery so please be kind! :slight_smile:

Here you can see the ext on github.

Here you can see the code in question.

Any help would be highly appreciated!

I also paste it here for your eyes.

if (images.meta.status == 200)
                console.log(typeof preview_gif_url[i]);
                // console.log(preview_gif_url);
                var img = document.createElement("img");
                img.setAttribute("src", images.data[i].images.fixed_height_small.url);
                img.setAttribute("alt", images.data[i].title);
                img.setAttribute("id", images.data[i].id);
                img.setAttribute("class", "item");
                img.onclick = function (){let attach = fetchImages(this.id, true)};
                img.onmouseover = function(){
                    // console.log('<img src="'+ preview_gif_url[i] +'"/>');
                    $(this).balloon({ position: "top",
                        html: true,
                        contents: '<img src="' + preview_gif_url[i] + '"/>',

Thank you all in advance!

I am not sure if this will solve the problem but I think there is no need of single quote right after the double quote at start and end as well. Try writing like below.

contents: '<img src="+ preview_gif_url[i] + "/>',

@G00njan thanks but it wasn’t that.

For some reason the onmouseover event does not see the variables of the function.
I don’t understand why. Since the event is declared within the function. So I had to device a new solution.
Could someone explain to me why this happens?

This topic was automatically closed 182 days after the last reply. New replies are no longer allowed.