PayneLess Designs - Mouseover - Simple JS (New Version)

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"><head>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<title>Mouseover - Simple JS</title>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7" />
<meta name="author" content="Ron" />
<meta name="date" content="3/10/2009" />
<meta name="copyright" content="PayneLess Designs" />
<!-- <link href="A]css_page_designs.css" rel="stylesheet" type="text/css" /> -->
<style type="text/css">
a img { border: 0; }
#wrap {
width: 960px;
margin: 0 auto;
}

h1 { text-align: center; }

p.image { width: 150px; margin: 0 auto; }

pre {
padding: 10px;
font-size: .5em;
color: #ff0;
line-height: 2em;
background: #000;
</style>
</head>
<body>
<div id="wrap">
<h1>Mouseover - Simple JS</h1>

<pre>
&lt;img style="width: XXpx; height: YYpx; border: 0;" src="image1.gif" onmouseover="this.src='image2.gif'" onmouseout="this.src='image1.gif'"
alt="" />
</pre>
<p class="image"><img style="width: 300px; height: 206px;" src="http://i.imgur.com/eKma0.jpg" onmouseover="this.src='http://i.imgur.com/nbMfD.jpg'" onmouseout="this.src='http://i.imgur.com/eKma0.jpg'" alt="" /></p>

<h3>As a Link:</h3>

<pre>
&lt;a href="http://Google.com/" title="Google">&lt;img style="width: XXpx; height: YYpx; border: 0;" src="image1.gif"
onmouseover="this.src='image2.gif'" onmouseout="this.src='image1.gif'" alt="" />&lt;/a>
</pre>

<p class="image"><a href="http://PayneLessDesigns.com/" title="Google"><img style="width: 300px; height: 206px;"src="http://i.imgur.com/eKma0.jpg" onmouseover="this.src='http://i.imgur.com/nbMfD.jpg'" onmouseout="this.src='http://i.imgur.com/eKma0.jpg'" alt="" /></a></p>
</div>
</body></html>