我正在使用I don't want to play/pause video框架。
我想实施点击操作。
当我点击播放器时，我想获得有关鼠标位置（x，y）和视频当前时间的信息。
然而， <video
id="myvideo"
class="video-js"
controls
preload="auto"
data-setup='{}'>
<source src="http://media.w3.org/2010/05/sintel/trailer.mp4" type="video/mp4"></source>
<source src="http://media.w3.org/2010/05/sintel/trailer.webm" type="video/webm"></source>
<source src="http://media.w3.org/2010/05/sintel/trailer.ogv" type="video/ogg"></source>
<p class="vjs-no-js">
To view this video please enable JavaScript, and consider upgrading to a
web browser that
<a href="http://videojs.com/html5-video-support/" target="_blank">
supports HTML5 video
</a>
</p>
</video>
<script type="text/javascript">
videoElement = document.getElementById("myvideo");
videoElement.addEventListener("mousedown", mouseHandler, false);
function getElementCSSSize(el) {
var cs = getComputedStyle(el);
var w = parseInt(cs.getPropertyValue("width"), 10);
var h = parseInt(cs.getPropertyValue("height"), 10);
return {width: w, height: h}
}
function mouseHandler(event) {
var size = getElementCSSSize(this);
var scaleX = this.videoWidth / size.width;
var scaleY = this.videoHeight / size.height;
var rect = this.getBoundingClientRect(); // absolute position of element
var x = ((event.clientX - rect.left) * scaleX + 0.5)|0; // round to integer
var y = ((event.clientY - rect.top ) * scaleY + 0.5)|0;
console.log("x : " + x);
console.log("y : " + y);
console.log("Video Current Time :" + videoElement.currentTime);
}
</script>
。
我要显示控制栏。
我该怎么办？
这是身体部位（下方）
.vjs-tech {
pointer-events: none;
}
我在css文件中尝试了这段代码。
6.2.0如果我写这个声明，视频播放器在我点击视频时不会播放或停止播放。但是，我的mouseHandler动作也没有用。
我的videojs版本为[source]="personalData('test')"
答案 0 :(得分：0)
我解决了这个问题。在我的点击事件中，我再次实施了游戏切换操作。
function mouseHandler(event) {
if(video.paused()){
video.play();
}
else{
video.pause();
}
var size = getElementCSSSize(this);
var scaleX = this.videoWidth / size.width;
var scaleY = this.videoHeight / size.height;
var rect = this.getBoundingClientRect(); // absolute position of element
var x = ((event.clientX - rect.left) * scaleX + 0.5)|0; // round to integer
var y = ((event.clientY - rect.top ) * scaleY + 0.5)|0;
console.log("x : " + x);
console.log("y : " + y);
console.log("Video Current Time :" + videoElement.currentTime);
}