Изменения дочерних блоков не затрагивая родителя
Изменить стиль блока, не меняя родительские и дочерние, имеющие точно такой же class
by Alexander Lashchevsky
HTML
<div class="block">
<div class="block">
<div class="block">
<div class="block">
Text
</div>
Text
</div>
Text
</div>
Text
</div>
CSS
.block {
padding: 5px;
border-color: #808080;
border-style: solid;
border-width: 1px 1px 3px 3px;
}
.hover {
border-color: red;
color: red;
}
.hover .block{
color: black;
}
JavaScript
$(".block").hover(function () {
$(".block").removeClass("hover");
$(this).addClass("hover");
}, function () {
$(".block").removeClass("hover");
$(this).parent(".block").addClass("hover");
});