javascriptjqueryimagebpopup

Load image in bPopup

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.

Solution

  • 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();