dragonlu
28 Jan 2011, 08:04 PM
Ive been trying to have this code enlarge an image when I roll over it but I cant get it to not push down the image below it when the picture above it is rolled over and enlarged, also I wanted to have the pictured that gets enlarged to go over any other content around it without disturbing it.
Tried a number of ways for about 3 hours now but just cant get it right.
wouldnt let me put URLs so the image source is empty
<html>
<head>
<style type="text/css">
div.img
{
height: auto;
width: auto;
position: absolute;
}
div.img a:hover img {
width: 420px;
height: 350px;
position: relative;
</style>
</head>
<body>
<div class="img">
<a target="_blank" href="klematis2_big.htm">
<img src="C:\Documents and Settings\Owner.YOUR-08ED9A6901\Desktop\awd\CIMG0420.JPG" alt="Klematis" width="110" height="90"
</div>
<div class="img">
<a target="_blank" href="klematis2_big.htm">
<img src="C:\Documents and Settings\Owner.YOUR-08ED9A6901\Desktop\awd\casa_1.jpg" alt="Klematis" width="110" height="90"
</div>
</div>
</body>
</html>
Tried a number of ways for about 3 hours now but just cant get it right.
wouldnt let me put URLs so the image source is empty
<html>
<head>
<style type="text/css">
div.img
{
height: auto;
width: auto;
position: absolute;
}
div.img a:hover img {
width: 420px;
height: 350px;
position: relative;
</style>
</head>
<body>
<div class="img">
<a target="_blank" href="klematis2_big.htm">
<img src="C:\Documents and Settings\Owner.YOUR-08ED9A6901\Desktop\awd\CIMG0420.JPG" alt="Klematis" width="110" height="90"
</div>
<div class="img">
<a target="_blank" href="klematis2_big.htm">
<img src="C:\Documents and Settings\Owner.YOUR-08ED9A6901\Desktop\awd\casa_1.jpg" alt="Klematis" width="110" height="90"
</div>
</div>
</body>
</html>