function rollover(el) {
    if (el) {
        var newImg = "";
        var newPath = "";
        var oldImg = "";
        var paths_array = el.src.split("/");

        oldImg = paths_array[paths_array.length - 1];

        extention_array = oldImg.split(".");
        extention = extention_array[extention_array.length - 1];

        oldImg = extention_array[0];

        newImg = el.id.replace(/rollover__/g, "");
        newImg = newImg + "." + extention;

        for (var i = 0; i < (paths_array.length - 1); i++) {
            newPath = newPath + paths_array[i] + "/";
        }

        newImg = newPath + newImg;
        el.src = newImg;
        el.id = "rollover__" + oldImg;
    }
}

function preload(el) {
    if (el) {
        var newImg = "";
        var newPath = "";
        var oldImg = "";
        var paths_array = el.src.split("/");

        oldImg = paths_array[paths_array.length - 1];

        extention_array = oldImg.split(".");
        extention = extention_array[extention_array.length - 1];

        oldImg = extention_array[0];

        newImg = el.id.replace(/rollover__/g, "");
        //newImg = el.src.replace(oldImg, newImg);
        newImg = newImg + "." + extention;

        for (var i = 0; i < (paths_array.length - 1); i++) {
            newPath = newPath + paths_array[i] + "/";
        }

        var img = new Image(el.width, el.height);
        img.src = newPath + newImg;
    }
}

var myrules = {
    'img.img_rollover': function(element) {
        // preload the rollover image
        preload(element);

        // onmouse over handler
        element.onmouseover = function() {
            rollover(this);
        }

        // onmouse out handler
        element.onmouseout = function() {
            rollover(this);
        }

    }
};

Behaviour.register(myrules);