so i wanted to have some links in which the background color fades in
and out on hover. thing is, though, i wanted to have the text of the
links not fade - only the background-color. so i thought, okay, i'll
just make three elements:
a parent div,
a child display:block link,
and another child link, this one with a high z-index.

this way i can fade the first child link, and since the second child
has a high z-index, it will stay above the fade.
so i do that:

<script type="text/javascript">
$(document).ready(function(){
$(".animate").fadeTo("slow", 0.1);



$(".animate").hover(function(){

$(this).fadeTo("slow", 1.0);

},function(){

$(this).fadeTo("slow", 0.1);

});



});
</script>
<body>
.....
<div id="links">
<a href="#" class="animate"></a><a href="#" class="second">Lorem</a>
<a href="#" class="animate"></a><a href="#" class="second">Lorem</a>
<a href="#" class="animate"></a><a href="#" class="second">Lorem</a>
</div>
...
</body>
</html>

but then i realize that jquery can't do classes, only ids. and i can't
do $("#links a").fadeTo("slow", 0.1); because that will fade both
classes of links, when i only want the .animate links to fade.

so, uh, anyone know of a way to fade only a background color/image
without fading the text?

Reply via email to