Форум

Georgie · #1 (**permalink**) 13.11.2019, 18:36

Здравствуйте.
Мне надо сделать так, чтобы при наведении на блок "two" opacity можно было применить к "one". Это возможно, если да, то как?
Code:
HTML:
<div id = 'one'>
<div id = 'two'>
<div id = 'three'>
<div id = 'four'>
CSS:
#one:hover ~ #two, #one:hover ~ #three, #one:hover ~ #four{
opacity: 0.2
}
#two:hover{
z-index: 9999;
}
#two:hover ~ #one{
opacity: 0.2
}

При наведении на блок 'one', всё работает, но на блок two - нет. Кто знает, как исправить?

рони · #2 (**permalink**) 13.11.2019, 18:38

Сообщение от Georgie

чтобы изменить слой выше стоящего

нет такого в css

Georgie · #3 (**permalink**) 13.11.2019, 18:45

Сообщение от рони

нет такого в css

Я не так выразился. Мне надо сделать так, чтобы при наведении на блок "two" opacity можно было применить к "one"

рони · #4 (**permalink**) 13.11.2019, 18:47

Georgie,

<!DOCTYPE html>

<html>
<head>
  <title>Untitled</title>
  <meta charset="utf-8">
  <style type="text/css">
    div{
        background-color: #FF00FF;
         height: 70px;
         width: 200px;
         margin: 5px;
    }
    fieldset:hover div{
        opacity: .2;
    }
    fieldset:hover div:hover{
        opacity: 1;
    }
    fieldset{
        width: 200px;
    }

  </style>

</head>

<body>
<fieldset>
<div id = 'one'></div>
<div id = 'two'></div>
<div id = 'three'></div>
<div id = 'four'></div>
</fieldset>
</body>
</html>

Georgie · #5 (**permalink**) 13.11.2019, 19:02

Спасибо :3

Форум

Справочник

Discord чат

Курсы javascript