У мене є кілька .box div, включаючи короткий текст (<p>
) та ескізом. Я намагаюся змінити непрозорість тексту в .box div, коли будь-яка частина .box зависає, але я не хочу, щоб це впливало на зображення. Поки що я це зрозумів:
jQuery(document).ready(function(){
$(".box").fadeTo("fast", 0.6);
$(".box").hover(function(){
$(this).fadeTo("fast", 1.0);
},function(){
$(this).fadeTo("fast", 0.6);
});
});
Я знаю, що це має бути досить просто, але я застряг. Дякую за допомогу.
Відповіді:
0 для відповіді № 1Використовуйте .find()
щоб отримати просто <p>
всередину застосувати вицвітання, як це:
jQuery(function(){
$(".box p").fadeTo("fast", 0.6);
$(".box").hover(function(){
$(this).find("p").fadeTo("fast", 1.0);
},function(){
$(this).find("p").fadeTo("fast", 0.6);
});
});
Це використовує $(".box p")
щоб тільки згасати <p>
Елементи спочатку, потім у наведенні (для всього поля) ми знаходимо те саме <p>
елементи всередині. Якби ти $(".box p").hover(...)
тільки ширяє на <p>
сама попрацювала б.
1 для відповіді № 2
Користувач $(".box p")
селектор
0 для відповіді № 3
Можливо, ви могли розмістити мініатюрну картинкупоза полем ви намагаєтеся зникнути або використовувати більш точний селектор, наприклад $ (". box p"). Залежить, чи хочете ви, щоб прикраса коробки вицвіла, або просто текст.
це також може працювати:
<div class="container">
<img id="thumbnail" src="/images/" style="float: left; /* or position abosolute"/>
<div id="box">
<p>text</p>
</div>
</div>
<script type="text/javascript">
$(document).ready(function() {
// $(".box p").fadeIn("fast");
// or:
$(".box").fadeIn("fast");
});
</script>