Изменение непрозрачности div, исключая часть содержимого div - jQuery - PullRequest
0 голосов
/ 17 сентября 2010

У меня есть несколько .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);
});
});

Я знаю, это должно быть довольно просто, но я застрял.Спасибо за помощь.

Ответы [ 3 ]

1 голос
/ 17 сентября 2010

Пользователь $(".box p") селектор

0 голосов
/ 17 сентября 2010

Вы, вероятно, могли бы поместить миниатюру изображения вне поля, которое вы пытаетесь исчезнуть, или использовать более точный селектор, такой как $ ('. Box p').Зависит от того, хотите ли вы, чтобы само оформление коробки исчезло или просто текст.

это также может работать:

<div class="container">
    <img id="thumbnail" src="" 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>
0 голосов
/ 17 сентября 2010

Используйте .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>.

...