<h3 id="magnifier">
  My content will expad and change color once  the mouse is over. This is really funny
</h3>
.magnify{
  font-family: arial;
  font-size: 300%;
  color: blue;
}

.normalize{
  font-family: sans-serif;
  color: auto;
  font-size: auto;
}
 var magnifier = document.getElementById('magnifier');

magnifier.addEventListener('mouseover', magnify);

magnifier.addEventListener('mouseout', normalize);

//CallBack Function 1
function magnify(){
  magnifier.className = 'magnify';  
}
 //Callback Function 2
function normalize(){
  magnifier.className = 'normalize';
}

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.