1

i'm trying to make a login screen for my card game project where the user can select the card he wants to get. i'm doing this by creating cards from a class Card which extends Rectangle and calls the superclass' constructor. Then, i add the created cards for the user to choose to an HBox and give them an ID. The idea is that, when the user hovers over or clicks on one of the cards (children of HBox), the card changes opacity to let the user know they did something. The problem is...it's not working.

From the LoginScreen class: 

//filling the HBox up with a number of cards based on the amount of players
for(int dezeKaart = 0; dezeKaart < lijstVanBeschikbareKleuren.size(); dezeKaart++){
    KleurKaart dezeKleur = new KleurKaart(lijstVanBeschikbareKleuren.get(dezeKaart));
    kiesKleurKaartBox.getChildren().add(dezeKleur);            
    dezeKleur.setId("kleurKiezer");
}

from the CSS class: 

#kleurKiezer {
   -fx-opacity: 5.0;
   -fx-border-width: 0 ; 
}

the hover one: 

#kleurKiezer:hover{
   -fx-opacity: 1.0;
   -fx-border-width: 5 ; 
   -fx-border-color: #FF847C;
}
ItachiUchiha
  • 36,135
  • 10
  • 122
  • 176
user3649731
  • 23
  • 3
  • Did you try something like `#kleurKiezer:hover * `? See http://stackoverflow.com/questions/4910077/select-all-child-elements-recursively-in-css Also, Opacity should be between 0 (transparent) and 1 (opaque). 5.0 is not a valid value. – Itai Jul 22 '16 at 09:02
  • 1
    Furthermore multiple Nodes with the same ID in the same scene should get you into trouble... – fabian Jul 22 '16 at 09:06
  • Changing opacity to a number between 0 and 1 worked. Can't believe i didn't look further into that before doing anything else. Thanks! – user3649731 Jul 22 '16 at 10:24
  • You may want to answer your own question and mark it as accepted as soon as you can. – Michel Jung Jul 23 '16 at 11:19

0 Answers0