Simple Jquery question

JavaScript
1

I basically have this code currently:

<div class="item">
  <a href="#"><img class="thumb" src="pic.jpg"></a>
</div>

When I use the following Jquery code, it works and fades the entire div.

$(document).ready(function() {
	$("div.item").fadeTo("slow", 0.7);
	$("div.item").hover(function() {
		$(this).fadeTo("slow", 1.0);
		},function(){
			$(this).fadeTo("slow", 0.7);
	});
});

However, I only want to fade the <img> so I tried this:

$(document).ready(function() {
	$(".thumb").fadeTo("slow", 0.7);
	$(".thumb").hover(function() {
		$(this).fadeTo("slow", 1.0);
		},function(){
			$(this).fadeTo("slow", 0.7);
	});
});

The thumb class is only applied to that img. It does not work. What am I doing wrong?

2

The code looks correct. My guess would be you have some other issue. Try making a working html page that demonstrates the issue. Make it as minimal as possible. You’ll probably figure out your issue while preparing it.

btw- what’s the purpose of the <a> tag?

3

The original code is actually a part of a WP theme so the # is actually some PHP.

I tested it out and it is not working. I made a basic html page and switched the codes. Only works when it’s a div. I even put the .thumb in the <a> instead and nothing. Hm.

I have another question. The code entails a <img> tag however when I view it in Firebug, it turns that <img> into a div with a background-image. However when I do a traditional “view source” it’s just an <img> tag again. Does anyone understand why that is? I sense this is the actual problem.

4

Great. Go ahead and post that.

You probably have some javascript which modifies the page. This is exactly the reason i said to make a minimal demonstration. Pretend you have entered a contest, and the goal is to use the least amount of characters to demonstrate your problem. The end result should be very small.

5

Well, you were right. I didn’t simplify the code thoroughly enough and apparently it was this “baseline img” JS fix that messed it up. Damn, that delayed me. Thanks.

http://estevancarlos.com/wp-content/themes/ecv6/test.html