нужен селектор jquery

Question

У меня есть следующая разметка:

<div class="thumb">
   <img src="thumb.jpg"/>
   <p>Some text here</p>
</div>

По сути, мне нужен селектор, чтобы при наведении большого пальца на div-идентификатор я мог оживить ребенка p.

Я пробовал это:

$('.thumb').hover(function() {
    $(this > "p")animate({ "top":"35px" });
}, function() {
    $(this > "p").animate({ "top":"115px" });
});

Не работает, хотя по какой-то причине.

Спасибо

Answer 1

this - это объект, а не строка, поэтому вы не можете просто поместить его в селектор.Вместо этого вы хотите использовать метод .find():

$(this).find("p").animate({"top": "35px"});

Что соответствует селектору ".thumb p".Чтобы получить то же поведение, что и ".thumb > p", вы можете использовать .children("p") вместо .find("p"), но здесь разница не значительна.

Также очень важно, чтобы вы сделали no опечатки, такие как пропущенный . перед animate;)

Answer 2

Изменить на:

$('>p', this).animate({....

Эта конструкция извлекает P-элементы первого уровня в «this», что вы и пытались сделать.Вам не нужно использовать find () или children () и т.д ..., чтобы получить дочерних элементов первого уровня, которые являются тегами P.Я думаю, что эта конструкция проще и интуитивнее.

PS у вас также есть «.»отсутствует до вашего первого «одушевленного»;

Answer 3

Вы можете использовать .children() для выбора тега <p> - http://api.jquery.com/children/:

$(this).children('p').animate(...);

Answer 4

Может быть:

$('.thumb').hover(function() {
    $(this).find('p').animate({ "top":"35px" });
}, function() {
    $(this).find('p').animate({ "top":"115px" });
});

Answer 5

Это не работает:

$(this > "p")

Попробуйте это:

$(this).find('p')