Javafx - псевдокласс внутри псевдокласса

Question

У меня есть практическая проблема, когда есть изображение стрелки, которое либо включено, либо отключено, я переключился между двумя разными изображениями для обоих случаев. Когда стрелка активна, я устанавливаю псевдокласс, который меняет изображение на синий, а когда оно отключено, изображение серое

фрагмент CSS, который делает это:

#navigateLeftImage:enabled
{
    -fx-image:url("images/left-arrow.png");
}

Я включаю состояние псевдокласса при некотором условии.

Теперь еще одна вещь, которая необходима, когда я наведу курсор на включенное изображение, оно должно масштабироваться, что может быть достигнуто с помощью css selector: hover, но я хочу, чтобы оно увеличивалось, только если его изображение включено.

Если бы я мог вкладывать псевдокласс в псевдокласс, я бы сделал что-то вроде этого

#navigateLeftImage:enabled
{
    -fx-image:url("images/left-arrow.png");
    #navigateLeftImage:hover
    {
      //css to scale
    }
}

Я знаю, что могу добавить обработчик для наведения, а затем удалить его, когда изображение отключено, но в конце я прибегну к нему.

Answer 1

CSS не позволяет вам поместить правило в другое правило. Вы можете использовать несколько правил и выбрать использовать селектор, который применяется, только если присутствуют оба псевдокласса:

#navigateLeftImage:enabled
{
    -fx-image: url("images/left-arrow.png");
}

#navigateLeftImage:hover:enabled
{
  //css to scale
}