Sconsiglio vivamente di usare degli attributi "personalizzati" per un motivo molto semplice: se si passa il documento HTML al validatore del W3C, non te lo valida, ovviamente, nemmeno se ti metti a pregare in giapponese.

Una soluzione che ho studiato è la seguente:
codice:
function RolloverItem (img_id, src_normal, src_over)
{
    this.img_id = img_id;
    this.img_normal = new Image ();
    this.img_normal.src = src_normal;
    this.img_over = new Image ();
    this.img_over.src = src_over;
}

function Rollover ()
{
    this.items = new Array ();
    Rollover.prototype.add = function (img_id, src_normal, src_over)
    {
        this.items[this.items.length] = new RolloverItem (img_id, src_normal, src_over);
    }
    Rollover.prototype.setup = function ()
    {
        for (var i = 0; i < this.items.length; i++)
        {
            if (document.getElementById)
                obj = document.getElementById (this.items[i].img_id);
            else
                return;

            obj.img_normal = this.items[i].img_normal;
            obj.img_over = this.items[i].img_over;
            obj.onmouseover = new Function ('this.src = this.img_over.src');
            obj.onmouseout = new Function ('this.src = this.img_normal.src');
        }
    }
}
Questo codice sopra potrebbe stare in un file .js separato, ad esempio.

Poi, dove serve fare il rollover:
codice:
var rollover = new Rollover ();
rollover.add ('img1', 'normale1.gif', 'over1.gif');
rollover.add ('img2', 'normale2.gif', 'over2.gif');
....
Poi all'evento onload del body si mette: rollover.setup()