video添加自定义控件，使video视频播放时，控件层级处于video上方

可以通过以下步骤实现在video上方添加自定义控件：

1. 在HTML中，使用`<div>`标签包裹`<video>`标签和自定义控件所在的`<div>`标签。

<div class="container">
  <video src="video.mp4"></video>
  <div class="custom-controls"></div>
</div>

2. 在CSS中，将`<div>`标签设置为相对定位，并将自定义控件所在的`<div>`标签设置为绝对定位。然后，使用`z-index`属性将自定义控件的层级设置为更高，以使其位于video上方。

.container {
  position: relative;
}

.custom-controls {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1;
}

3. 在JavaScript中，使用`querySelector()`方法获取自定义控件所在的`<div>`标签，并在video播放时显示它。

var video = document.querySelector('video');
var controls = document.querySelector('.custom-controls');

video.addEventListener('play', function() {
  controls.style.display = 'block';
});

video.addEventListener('pause', function() {
  controls.style.display = 'none';
});

这样，自定义控件就可以在video上方显示，并在video播放时显示。