PDA

Click to See Complete Forum and Search --> : Img Push Down

The Little Guy
12-08-2005, 01:34 PM
how would you make an image look like it is being pushed in when you hover over it? The closest that I can get is with this:

a:hover img {Filter: Blur(Add = 0, Direction = 225, Strength = 10)}

But that makes it blur, and I don't want it to blur, as a matter of fact it would be nice if it wasn't a filter.

That makes the image look like somone pushes it down and in goes down and to the left
ray326
12-08-2005, 04:11 PM
Two images or play with borders. Try this in something other than IE.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<meta name="Content-Script-Type" content="text/javascript">
<meta name="Content-Style-Type" content="text/css">
<title>Conforming HTML 4.01 Template</title>
<style type="text/css">
body { background: #eee }
img {
border: solid black 1px;
border-top:none;
border-left:none;
}
img:hover {
border: solid black 1px;
border-right:none;
border-bottom:none;
}
</style>
</head>
<body>
<img src="http://www.webdeveloper.com/forum/images/webdev-logo2.gif" alt="">
</body>
</html>
The Little Guy
12-08-2005, 08:28 PM
Thanks! that works great. Is their a way to make the image shrink a little bit?
ray326
12-09-2005, 12:18 AM
Two images.
The Little Guy
12-09-2005, 05:03 PM
many images