延迟CSS的问题

Question

我正在尝试延迟CSS转换，但似乎没有工作。这就是我想要发生的事情：

1. 发布视频

2. 将鼠标指针移出视频

3. 控制栏缩小，但播放进度变大。

4. 将鼠标指针移回视频，控制栏恢复正常。

正如您在CodePen笔中看到的那样，播放进度条在我想要之前变得更大：http://codepen.io/mboles/pen/mJeJOO

以下是我目前使用的CSS：

#myPlayerID.vjs-has-started.vjs-user-inactive .vjs-progress-control {
  -webkit-transform: translateY(-25px);
}

#myPlayerID.vjs-has-started.vjs-user-inactive .vjs-play-progress {
  -transition-delay: height 3s; 
  height: 10px;
}

我试图改变转换延迟和高度的顺序，但这并没有解决问题。

非常感谢 - 马特

Answer 1

事实证明，转换延迟不能将属性置于延迟状态，必须使用transition-property明确说明。所以解决方案是：

test.loc[g_test.get_group((1, 5, 13, 8)).index, 'monthly_sales'] = \
           g_train.get_group((1, 5, 13, 8)).monthly_sales.mean()