hover کردن عناصر

[goldenflower 47]

سلام به همه دوستان

سوالم اینه:

مثلا ما سه تا div داریم به صورت زیر:

<div class="div-1">
<div class="div-2">
<div class="div-3">

در ابتدا هرسه دارای opacity:1 باشن یعنی حالت معمولی ، حالا من میخوام وقتی موس رفت روی یکی از این ها دوتا div دیگه opacity:0.8 داشته باشن. یعنی عنصری که موس روش رفت تغییری نکنه و دوتای دیگه opacityـــشون کم بشه.

اگه ممکنه کد چنین چیزی رو در اختیارم قرار بدید و لطفا یکم توضیح هم بدید تا بتونم استفاده کنم.

باتشکر

[پویابهروش 237]

شما می تونید از + در سلکتور استفاده کنید.

یا اینکه می تونید کدها رو به این صورت بنویسید:

<div class="father">
<div class="div-1">
<div class="div-2">
<div class="div-3">
</div>

و این استایل رو براش به کار ببرید:

.father:hover div{
opacity:0.1;
}
.father div:hover{
opacity:1;
}

یعنی اینطوری:

<style>
.father:hover div{
opacity:0.1;
}
.father div:hover{
opacity:1;
}
</style>
<div class="father">
<div class="div-1"></div>
<div class="div-2"></div>
<div class="div-3"></div>
</div>

ویرایش شده تیر 93 توسط پویابهروش

[goldenflower 47]

ممنون از توضیحات کامل و بی نقصتون.

اولش جواب نداد ، یه خورده با کدها سروکله زدم تا اشکال کارم رو پیدا کردم و درست شد

یه دنیا تشکر