Div to follow mouse center

Question

I'm trying to use this to follow my cursor and magnify a small area that I'm hovering. http://jsfiddle.net/wwwrha04/

Here is the JS

(function($) {

    $(document).ready(function() {
        var scale = 2;

        var $magnifyingGlass = $('<div class="magnifying_glass"></div>');
        var $magnifiedContent = $('<div class="magnified_content"></div>');
        var $magnifyingLens = $('<div class="magnifying_lens"></div>');

        //setup
        $magnifiedContent.css({
            backgroundColor: $("html").css("background-color") || $("body").css("background-color"),
            backgroundImage: $("html").css("background-image") || $("body").css("background-image"),
            backgroundAttachment: $("html").css("background-attachment")  || $("body").css("background-attachment"),
            backgroundPosition: $("html").css("background-position") || $("body").css("background-position")
        });


        $magnifiedContent.html($(document.body).html());

        $magnifyingGlass.append($magnifiedContent);
        $magnifyingGlass.append($magnifyingLens); //comment this line to allow interaction
        $(document.body).append($magnifyingGlass);

        //funcs
        function updateViewSize() {
            $magnifiedContent.css({width: $(document).width(), height: $(document).height()});
        }

        //begin
        updateViewSize();

        //events
        $(window).resize(updateViewSize);

        $magnifyingGlass.mouseover(function(e) {
            e.preventDefault();
            $(this).data("drag", {mouse: {top: e.pageY, left: e.pageX}, offset: {top: $(this).offset().top, left: $(this).offset().left}});
        });

        $(document.body).mousemove(function(e) {
            if ($magnifyingGlass.data("drag")) {
                var drag =$magnifyingGlass.data("drag");

                var left = drag.offset.left + (e.pageX-drag.mouse.left);
                var top = drag.offset.top + (e.pageY-drag.mouse.top);

                $magnifyingGlass.css({left: left, top: top});
                $magnifiedContent.css({left: -left*scale, top: -top*scale});

            }
        }).mouseup(function() {
            $magnifyingGlass.removeData("drag");
        });
    });

    })(jQuery);

What can I do to make to make sure that my cursor sticks to the center of the magnified Div? Also how can I make it jump to the cursor whenever I the cursor enters the browser?

Or do anyone have a better way to create this function? I can only find image magnifiers and I need to be able to zoom in on any kind of element.