/ / Zmena opacity div s vylúčením časti obsahu div - jQuery - jquery, vznášanie, opacita

Zmena div opacity okrem niektorých obsahov div - jQuery - jquery, hover, opacity

Mám niekoľko súborov .box div vrátane krátkeho textu (<p>) a miniatúra. Pokúšam sa zmeniť nepriehľadnosť textu v priečinku .box div, keď je ktorákoľvek časť priečinka .box umiestnená kurzorom myši, ale nechcem, aby to malo vplyv na obrázok. Zatiaľ mám toto:

jQuery(document).ready(function(){
$(".box").fadeTo("fast", 0.6);

$(".box").hover(function(){
$(this).fadeTo("fast", 1.0);
},function(){
$(this).fadeTo("fast", 0.6);
});
});

Viem, že to musí byť celkom jednoduché, ale zasekla som sa. Ďakujem za pomoc.

odpovede:

0 pre odpoveď č. 1

použitie .find() získať práve <p> vnútri aplikovať fade, napríklad takto:

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);
});
});

Toto používa $(".box p") iba vyblednúť <p> prvky, potom v umiestnení kurzora myši (pre celé pole) nájdeme to isté <p> prvky vo vnútri. Keby si to urobil $(".box p").hover(...) iba sa vznáša na <p> samo o sebe by fungovalo.


1 pre odpoveď č. 2

užívateľ $(".box p") volič


0 pre odpoveď č. 3

Pravdepodobne by ste mohli umiestniť miniatúrumimo poľa, ktoré sa snažíte vyblednúť, alebo použite presnejší selektor, napríklad $ (". box p"). Závisí to od toho, či chcete, aby vyblednutie samotnej škatule alebo iba text.

toto by tiež mohlo fungovať:

<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>