Load image in bPopup

Question

I have an ajax call for a progress bar for a file upload. This works fine. I tried to add a line to have bPopup open the image afterwards but I can't get it working.

This is my javascript:

ajax.addEventListener("load", completeHandler, false);

function completeHandler(e) {
    var fileDest = e.target.responseText;
    uploadedImg = new Image();
    uploadedImg.src = fileDest;
    _("uploadedImg").src=fileDest; // All above here works
    $('uploadedImg').bPopup();     // This doesn't
    _("progressBar").value = 0;    // This also works
}

I get no errors from javascript in the console in chrome. I have jquery 1.4.2 and bpopup files correctly linked.

HTML:

<img id="uploadedImg" src=""> // 'display:none' in css file

I have followed instructions on this page http://dinbror.dk/blog/bPopup/#Usage and cannot see what I have done wrong.

Answer 1

OK, fixed it :)

1. Put <img> in a div
2. Linked bpopup css http://dinbror.dk/bpopup/assets/style.min.css
3. Linked jquery.easing http://dinbror.dk/bpopup/assets/jquery.easing.1.3.js
4. Added missing # to $('uploadedImg').bPopup();

Answer 2

you have an error in calling your jquery

let's say you have a button or an a tag with id demo for example.In jquery you should call it like this : $("#demo") here you are calling it like this : $('uploadedImg').bPopup();

try to fix it to be like this : $('#uploadedImg').bPopup(); and try again