window.addEventListener('load', function(e) {

    //preload image to prevent flicker

    var imgs = document.getElementsByTagName('img');

    //loop 

    for (var i = 0; i < imgs.length; i++) {

        //add your code here to determing rollover original/replacement binding, my example is hard coded

        var rolloverSrc = 'https://farm3.staticflickr.com/2852/9704174376_b5c406c710_q.jpg';

        //preloading img into memory

        var preloadImg = document.createElement('img');

        preloadImg.src = rolloverSrc;

        //Alias varaible to keep in scope for listeners

        var img = imgs[i];

        preloadImg.addEventListener('load', function(e) {

            //Attach rollover events after image preloads

            img.addEventListener('mouseover', function(e) {

                this.setAttribute('data-orginal-src', this.src);

                this.src = rolloverSrc;

            }, false);

            img.addEventListener('mouseout', function(e) {

                var original = this.getAttribute('data-orginal-src');

                this.src = original;

            }, false);

        }, false);

    }

}, false);