title: Change image on hover
body: <p>How can I change this exact code to do the hovering effect on mouseover?</p>
  
  <p>I tried following some of the other questions and answers, but I could not really follow them.</p>
  
  <p>So the HTML is:</p>
  
  <pre><code>&lt;a href="RR.html"&gt;&lt;img src="R3.jpg" width=700 height=300 /&gt;&lt;/a&gt;
  
  &lt;div&gt;
      &lt;a href="SSX.html"&gt;&lt;img src="SSX.jpg" height=100 width=120 /&gt;&lt;/a&gt;
      &lt;a href="MPreview.html"&gt;&lt;img src="MaxPayne3Cover.jpg" height=100 width=120 /&gt;&lt;/a&gt;
      &lt;a href="NC.html"&gt;&lt;img src="NC.jpg" height=100 width=120 /&gt;&lt;/a&gt;
      &lt;/br&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p><strong>Now what I want to do is change the big size image when the mouse hovers over the small images.</strong></p>