gwt - 如何使 SplitLayoutPanel 的拖动器闪烁？

Question

所以，我有一个 SplitLayoutPanel，需要一个闪烁的拖动器。有没有可能实现它？使用 CSS，硬编码，什么？

Answer 1

注意- 纯粹的 css 效果将是 cpu 密集型的，因此我会选择基于 gif 的解决方案。

问题

拆分布局面板使用两个图像来提供水平和垂直拆分器。这些是 png 图像，不能动画（闪烁效果）。

解决方案

您可以使用动画 gif 图像获得闪烁效果。

您需要为这两个闪烁的替换“gif”图像。然后覆盖基本的 gwt 样式并确保您已!important为被覆盖的样式添加后缀。

.gwt-SplitLayoutPanel-HDragger {
  background: #e7e7e7 url(images/thumb_vertical_blinking.gif) center center no-repeat !important;
  cursor: col-resize;
}
.gwt-SplitLayoutPanel-VDragger {
  background: #e7e7e7 url(images/thumb_horz_blinking.gif) center center no-repeat !important;
  cursor: row-resize;
}

Answer 2

是的，有可能通过覆盖默认样式来实现

.gwt-SplitLayoutPanel .gwt-SplitLayoutPanel-HDragger { horizontal dragger }
.gwt-SplitLayoutPanel .gwt-SplitLayoutPanel-VDragger { vertical dragger }


.gwt-SplitLayoutPanel-VDragger {
       // your set of styles while dragging 
} 

.gwt-SplitLayoutPanel-HDragger {
       // your set of styles while dragging 
}