Here's my relevant code, I'm switch the image according to where I click. Is there some way for me to gradually switch the images? Maybe animate them while switching? A sort of fade in fade out.

```
<script type="text/javascript">
    jQuery(document).ready(function ($) { //fire on DOM ready
        $('#mainproductpicture').addpowerzoom({
            defaultpower: 2,
            powerrange: [2, 5],
            largeimage: null,
            magnifiersize: [200, 200] //<--no comma following last option!
        })

        $('#smallpictureone').click(function () {
            $("#mainproductpicture").attr("src", $(this).attr("src"));

            $('#mainproductpicture').addpowerzoom({
                defaultpower: 2,
                powerrange: [2, 5],
                largeimage: null,
                magnifiersize: [200, 200] //<--no comma following last option!
            })
        });

        $('#smallpicturetwo').click(function () {
            $("#mainproductpicture").attr("src", $(this).attr("src"));

            $('#mainproductpicture').addpowerzoom({
                defaultpower: 2,
                powerrange: [2, 5],
                largeimage: null,
                magnifiersize: [200, 200] //<--no comma following last option!
            })
        });

        $('#smallpicturethree').click(function () {
            $("#mainproductpicture").attr("src", $(this).attr("src"));

            $('#mainproductpicture').addpowerzoom({
                defaultpower: 2,
                powerrange: [2, 5],
                largeimage: null,
                magnifiersize: [200, 200] //<--no comma following last option!
            })
        });

        $('#smallpicturefour').click(function () {
            $("#mainproductpicture").attr("src", $(this).attr("src"));

            $('#mainproductpicture').addpowerzoom({
                defaultpower: 2,
                powerrange: [2, 5],
                largeimage: null,
                magnifiersize: [200, 200] //<--no comma following last option!
            })
        });

        $('#smallpicturefive').click(function () {
            $("#mainproductpicture").attr("src", $(this).attr("src"));

            $('#mainproductpicture').addpowerzoom({
                defaultpower: 2,
                powerrange: [2, 5],
                largeimage: null,
                magnifiersize: [200, 200] //<--no comma following last option!
            })
        });
    });
</script>

```

I have another *related* question about my javascript code. I'm using a Javascript library I found online that allows me to zoom the image around very nicely. However, when I switch the src to another image, the zoom remain on the first. So I'm 're-hooking' the library to the image each click I make. **Does this have a negatie performance hit I'm not aware of? Will a current gen correctly clean up after me?**