Using Pixastic and .live with a class of images

Question

I'm using the Pixastic plugin in JavaScript. I have a table filled with images that are blurred. When I go over them with the mouse I want them to get normal. And when the mouse leaves an image I want it to blur back. For some reason my code doesn't work. Here's the code:

Before, I copied the wrong code part, and I apologize for that this one is the one I'm asking about.

<script type="text/javascript">
    $(document).ready(function(){
        $('.photography').live('mouseover mouseout', function(event) {
            if (event.type == 'mouseover') {
                function () {Pixastic.revert('this');};
            }
            else {
                function(){Pixastic.process('this', "blurfast", {amount:0.5});};
            }
        });
    });
</script>

OK, so I managed to find my old code that actually works half way (when I hover over the image for the first time it works, but when I try for the second time it doesn't).

$(document).ready(function(){
    var blur = function() {Pixastic.process(this, "blurfast", {amount:0.5});};
    var unblur = function () {Pixastic.revert(this);};
    $('.photography').each(blur);
    $('.photography').hover(unblur,blur);
});

OK, so now I'm also adding the code for the function called revert:

revert : function(img) {
    if (Pixastic.Client.hasCanvas()) {
        if (img.tagName.toLowerCase() == "canvas" && img.__pixastic_org_image) {
            img.width = img.__pixastic_org_width;
            img.height = img.__pixastic_org_height;
            img.getContext("2d").drawImage(img.__pixastic_org_image, 0, 0);

            if (img.parentNode && img.parentNode.replaceChild) {
                img.parentNode.replaceChild(img.__pixastic_org_image, img);;
            }
            return img;
        }
    }
    else
        if (Pixastic.Client.isIE()) {
            if (typeof img.__pixastic_org_style != "undefined")
                img.style.cssText = img.__pixastic_org_style;
            }
        }

Answer 1

So yesterday my friend discovered how this could be done ... the problem was that the plugin converts images into canvas anyway her's the code :

$(document).ready(function(){

    $('.pic').each(function(){
        this.onmouseout = function(){
            var canvas1 = Pixastic.process(this, "blurfast", {amount:0.5});
            canvas1.onmouseover = function(){
                Pixastic.revert(this);

            }
        }

        this.onload = function(){
            var canvas = Pixastic.process(this, "blurfast", {amount:0.5});
            canvas.onmouseover = function(){
                Pixastic.revert(this);

            }
        }
    });
});