Question

This is the code I have (so far). I have had success with directly alerting the values from the large image url. I want to be able to return the values as an object to another variable but have had no success. What am I doing wrong?

$.fn.extend({
        getBgImage: function(callback){
            var path = $(this).css('background-image').replace('url', '').replace('(', '').replace(')', '').replace('"', '').replace('"', '');
            var tempImg = $('<img />');
            tempImg.hide(); //hide image
            tempImg.bind('load', callback());
            $('body').append(tempImg); // add to DOM before </body>
            tempImg.attr('src', path);
            $('#tempImg').remove(); //remove from DOM
        },
        jZoom: function(){
            var swide = $(this).children('.zimg').outerWidth(),
                shigh = $(this).children('.zimg').outerHeight(),
                large = $(this).attr('href');
            $(this).after('<div class="mousearea" style="width:'+swide+'px;height:'+shigh+'px;cursor:move;z-index:99;opacity:0;position:absolute;top:0;left:0;"></div>').parent('.zoom').after('<div class="large" style="background-image:url('+large+');"></div>');
            var limg = $(this).parent('.zoom').next('.large').getBgImage(function(){
                var y = $(this).height(), x = $(this).width();
                alert(x+' '+y); // this alerts the values as expected
                //return {x: x, x: y}; This is what I attempted to return the values
            });
//alert(limg.x); and this is where i check to see if the object are available but get undefined
        }
    });
    $(function(){
        $('.zoomme').each(function(){
            $(this).jZoom();
        });
    });

This is just a work in progress, mainly for the sake of doing it but would like to know where I have gone wrong so far.

Thanks in advance.

Answer 1

You are assigning the return value of the bgImage function, and not the return value of the function you are passing as an argument to bgImage.

Since the callback doesn’t actually get executed when you pass it, and is instead bound as a load handler, there is no way to get its return value at that point.