CodePen

HTML

            
              <h3>Click the small image</h3>
<IMG SRC="http://icons.iconarchive.com/icons/double-j-design/origami-colored-pencil/48/green-camera-icon.png" ALT=" " 
    ONMOUSEdown="document.images['large'].src='http://icons.iconarchive.com/icons/double-j-design/origami-colored-pencil/128/green-camera-icon.png'">
  <IMG SRC="http://icons.iconarchive.com/icons/double-j-design/origami-colored-pencil/48/red-camera-icon.png" ALT=" " 
    ONMOUSEdown="document.images['large'].src='http://icons.iconarchive.com/icons/double-j-design/origami-colored-pencil/128/red-camera-icon.png'">
  <BR><BR>
<p>This image below will change.</p>
  <IMG SRC="http://icons.iconarchive.com/icons/dapino/summer-holiday/128/camera-icon.png" ALT=" " NAME="large">
            
          
!
via HTML Inspector

CSS

            
              h3, p{font-family: Helvetica, san-serif;
   color: #3A89C9}
            
          
!
? ?
? ?
Must be a valid URL.
+ add another resource
via CSS Lint

JS

            
              
            
          
!
Must be a valid URL.
+ add another resource
via JS Hint
Loading ..................