Hey guys,
I have a problem making my website. I have this logo, and on hovering I want it to glow.
Now I have two images logo.png and logoGlow.png and on hovering I want to fadein logoGlow.png.
Now I have this:
<head>
<script>
$(function() {
$(".logo")
.find("span")
.hide()
.end()
.hover(function() {
$(this).find("span").stop(true, true).fadeIn();
}, function() {
$(this).find("span").stop(true, true).fadeOut();
});
});
</script>
<body>
<a href="index.html" class="logo">Arrow<span></span></a>
CSS
.logo {
margin-top: 30px;
display:inline-block;
position:relative;
text-indent: -9999px;
width: 463px;
height: 178px;
background: url(logo.png) no-repeat;
}
.logo span {
position:absolute;
top: 0; left: 0; bottom: 0; right: 0;
background: url(logoGlow.png) no-repeat;
}
But it's not working. Can you guys help me?