Moderator |
|
Volgens mij kan een hyperlink geen div overspannen.
Oplossing met JavaScript:
<!DOCTYPE html
PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<title>imageflip</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<script type="text/javascript">
var images = new Array();
images[0] = new Image();
images[0].src = "0.gif";
images[1] = new Image();
images[1].src = "1.gif";
images[2] = new Image();
images[2].src = "2.gif";
images[3] = new Image();
images[3].src = "3.gif";
// et cetera
function flip(id, index)
{
var img = document.getElementById(id);
img.src = images[index].src;
}
</script>
</head>
<body>
<img src="0.gif" id="pic" height="50" width="50" /><br />
<br />
<a href="" onmouseover="flip('pic', 1)" onmouseout="flip('pic', 0)">1</a><br />
<a href="" onmouseover="flip('pic', 2)" onmouseout="flip('pic', 0)">2</a><br />
<a href="" onmouseover="flip('pic', 3)" onmouseout="flip('pic', 0)">3</a><br />
</body>
</html>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html> <head> <title>imageflip</title> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /> <script type="text/javascript"> var images = new Array(); images[0] = new Image(); images[0].src = "0.gif"; images[1] = new Image(); images[1].src = "1.gif"; images[2] = new Image(); images[2].src = "2.gif"; images[3] = new Image(); images[3].src = "3.gif"; // et cetera function flip(id, index) { var img = document.getElementById(id); img.src = images[index].src; } </script> </head> <body> <img src="0.gif" id="pic" height="50" width="50" /><br /> <br /> <a href="" onmouseover="flip('pic', 1)" onmouseout="flip('pic', 0)">1</a><br /> <a href="" onmouseover="flip('pic', 2)" onmouseout="flip('pic', 0)">2</a><br /> <a href="" onmouseover="flip('pic', 3)" onmouseout="flip('pic', 0)">3</a><br /> </body> </html>
|