Currently, I have implemented two different menus on my application. One is a tabPane while the other is a VBox containing buttons. By using psuedo selectors, I was able to style the tabs when they are selected with CSS, like shown in this example:
.tab.log {
-fx-background-image: url("../images/log.png");
}
.tab.log:selected {
-fx-background-image: url("../images/logActive.png");
}
A similar functionality can be achieved with the buttons using the following CSS:
.battleButton {
-fx-background-image: url("../images/battle.png");
}
.battleButton:focused {
-fx-background-image: url("../images/battleActive.png");
}
However, one issue arises when switching between tabs as it removes the focus from the buttons. Is there a way to prevent this behavior?
Thank you!