Untitled

body {
-moz-background-size: 100%; /* Firefox 3.6+ */
-webkit-background-size: 100%; /* Safari 3.1+ и Chrome 4.0+ */
-o-background-size: 100%; /* Opera 9.6+ */
background-size: 100%; /* Современные браузеры */
}

#container {
position: relative;
width: 100%;
}

#left {
position: absolute;
top: 0px;
left: 0px;
width: 50%;
}

#right {
position: absolute;
top: 0px;
right: 0px;
width: 50%;
}

.img {
    position:fixed;

 display: inline-block;
 min-width:50%;
min-height:100%;
background: transparent url(http://htmlbook.ru/example/images/sun1.png) ; /* Путь к файлу с исходным рисунком  */
}


.img:hover {
width:50px;
height:10px;
background: url(http://htmlbook.ru/example/images/sun2.png) no-repeat; /* Путь к файлу с исходным рисунком  */
 }

<!DOCTYPE html>
 <html>
  <head>
   <meta charset="utf-8">
    <title>Demo</title>

   <link href="style.css" rel="stylesheet" type="text/css" />

  </head>
<body>

 <div id="container">
  <div id="left">

    <a class="img" href="sample.html" class="rollover"></a>

  </div>

 <div id="right">

  <a class="img" href="sample.html"><img src="http://htmlbook.ru/example/images/sun2.png" id="bg" alt="" /></a>

  </div>
 </div>

 </body>
 </html>