如何在JavaFx 8里实现 Hover效果。

css 3 transform:

 .myimage:hover {

  background-color: #dae7f3;
  transform: translate(-5px,-5px);
  effect: dropshadow( three-pass-box , rgba(0,0,0,1) , 5, 0.0 , 0 , 1 );
  box-shadow: 5px 5px 15px rgba(67, 72, 84, 0.5);
}

但是javafx 8只支持css 2.1 和部分css 3的语法，恰恰transform不在此列:

不过可以通过-fx-translate-x,和draopshadow实现悬浮图片或者其他物体的效果.

在css文件中定义一下class selector,然后在JavaFX Scene Builder 2.0 设置 style class 为myButton即可.

.myButton:hover {
  -fx-effect: dropshadow( three-pass-box , rgba(0,0,0,1) , 5, 0.0 , 0 , 1 );
   -fx-translate-x: -5px;
   -fx-translate-y: -5px;
}