Some trouble with jQuery
Is this html
<div class='title centered'>SCE</div>
<div class='description'>
Magna tristique开发者_如何学C pulvinar porta montes, scelerisque
odio montes porta habitasse, ut, arcu scelerisque vel, pellentesque
</div>
I need to fade childer div (description) after clicking on parent (title).
$('.title').click(function() {
$(this).find('.description').fadeOut(fadeTime);
})
What is wrong?
If you have this just once on your page, balalakshmi's answer will work. If you have more than one, go with this:
$('.title').click(function() {
$(this).next('.description').fadeOut(fadeTime);
})
Note the use of next
, which looks at the next element at the same level in the dom,instead of find
which looks for decedents.
Finally, if the effect you are really trying to achieve is a toggle on title click, use slideToggle or one of the many fadeToggle plugins.
did you try with this?
$('.title').click(function() {
$('.description').fadeOut(fadeTime);
})
Use $.next() to find the next element and work with that
$('.title').click( function() {
$(this).next('.description').fadeOut( fadeTime );
});
The wrong thing is that in your code "description" is not a child of "title".
I think balalakshmi's answer will do the job for you or you can use if you don't want to use "description" class as a selector:
$('.title').click(function() {
$(this).next().fadeOut(fadeTime);
})
Try with:
$("#t_sce").click(function() {
$("#d_sce").fadeOut(fadeTime);
});
I would have another parent div wrap around it.
<div class='item'>
<div class='title centered'>SCE</div>
<div class='description'>
Magna tristique pulvinar porta montes, scelerisque
odio montes porta habitasse, ut, arcu scelerisque vel, pellentesque
</div>
</div>
</div>
Then I would call using
$('.title').click(function() {
$(this).parents('div.item').find('.description').fadeOut(fadeTime);
})
This code is not depended on the order of the discription div.
精彩评论