No, no es eso, qué más quisiera yo. La que ves ahí es la imagen completa que estoy usando, una imagen que está compuesta de dos partes: la foto original y pegada debajo la misma foto pero en blanco y negro.
Lo que hay que hacer es usar la foto como fondo, de manera que se vea sólo la porcion de la foto que te interesa, es decir, o la mitad superior o la mitad inferior.
Este es el código, no obstante, era muy fácil cogerlo del la propia página donde está el ejemplo (botón derecho del ratón, ver código fuente)
Cita: <!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" lang="es-es">
<head>
<meta content="text/html; charset=ISO-8859-1" http-equiv="content-type" />
<title>Color a blanco y negro</title>
<style type="text/css">
.caja { margin: 0px auto;
position: relative;
width: 150px;
height: 99px;
}
a { display: block;
height: 100%;
width: 100%;
background: url(img/color_BN.jpg) no-repeat center top;
}
a:hover { background: url(img/color_BN.jpg) no-repeat center bottom;
}
</style>
</head>
<body>
<div class="caja"><a href="#"></a></div>
</body>
</html>
Mikel.