JSFiddle - React, Tailwind, and code Playground

MM_swapImage()

by Travis Almand

HTML

<script>
function MM_findObj (n, d) {
	console.log('find');
	var p;
  var i;
  var x;
  
  if (!d) {
  	d = document;
  }
  if ((p = n.indexOf("?")) > 0 && parent.frames.length) {
		d = parent.frames[n.substring(p+1)].document;
    n = n.substring(0,p);
  }
  if (!(x = d[n]) && d.all) {
  	x = d.all[n];
  }
  for (var i = 0;!x && i < d.forms.length; i++) {
  	x = d.forms[i][n];
  }
  for (var i = 0; !x && d.layers && i < d.layers.length; i++) {
  	x = MM_findObj(n, d.layers[i].document);
  }
  if (!x && d.getElementById) {
  	x = d.getElementById(n);
    return x;
  }
}

function MM_swapImage () {
	console.log('swap');
  var i;
  var j = 0;
  var x;
  var a = MM_swapImage.arguments;

  document.MM_sr = new Array;

  for (var i = 0; i < (a.length - 2); i += 3) {
    if ((x = MM_findObj(a[i])) != null) {
      document.MM_sr[j++] = x;

      if (!x.oSrc) {
        x.oSrc = x.src;
        x.src = a[i+2];
      }
    }
  }
}

function MM_swapImgRestore () {
	console.log('restore');
	var i;
  var x;
  var a = document.MM_sr;
  
  for(var i = 0; a && i < a.length && (x = a[i]) && x.oSrc; i++) {
  	x.src = x.oSrc;
  }
}
</script>

<a
  href="#"
  onMouseOut="MM_swapImgRestore()"
  onMouseOver="MM_swapImage('TestImage','','https://via.placeholder.com/150/ff0000/ffffff',1)">
  <img src="https://via.placeholder.com/150/0000ff/ffffff" alt="This is your Alt Text" name="TestImage" width="100" height="100" border="0">
</a>

JavaScript

console.clear();

function MM_findObj (n, d) {
	var p;
  var i;
  var x;
  
  if (!d) {
  	d = document;
  }
  if ((p = n.indexOf("?")) > 0 && parent.frames.length) {
		d = parent.frames[n.substring(p+1)].document;
    n = n.substring(0,p);
  }
  if (!(x = d[n]) && d.all) {
  	x = d.all[n];
  }
  for (var i = 0;!x && i < d.forms.length; i++) {
  	x = d.forms[i][n];
  }
  for (var i = 0; !x && d.layers && i < d.layers.length; i++) {
  	x = MM_findObj(n, d.layers[i].document);
  }
  if (!x && d.getElementById) {
  	x = d.getElementById(n);
    return x;
  }
}

function MM_swapImage () {
  var i;
  var j = 0;
  var x;
  var a = MM_swapImage.arguments;

  document.MM_sr = new Array;

  for (var i = 0; i < (a.length - 2); i += 3) {
    if ((x = MM_findObj(a[i])) != null) {
      document.MM_sr[j++] = x;

      if (!x.oSrc) {
        x.oSrc = x.src;
        x.src = a[i+2];
      }
    }
  }
}

function MM_swapImgRestore () {
	var i;
  var x;
  var a = document.MM_sr;
  
  for(var i = 0; a && i < a.length && (x = a[i]) && x.oSrc; i++) {
  	x.src = x.oSrc;
  }
}