问题描述:

I'm trying to get rid of the border around this video http://bit.ly/ZihaJV The idea is that the video plays on a white background with no borders. The problem might be due to the ratio of the video and the size of the player.

I also found this post but it doesn't solve the problem. I don't even have access to Flash to compile the swf. videojs disable black background

Using a with a white border around the video to hide the black lines appearing might be a work around but I run into a problem because the video needs to be responsive.

The actual webpage shows more borders than this testing one. Sorry but I can't show the original.

Thanks and any help will be welcome.

网友答案:

In the video you linked to, the border line along the top of the video is part of the video file itself, so it's an issue with the original file or the way you edited it. (I often have this problem with videos. Quite annoying.)

A quick visual fix with CSS would be to pull the top of the video up a bit and hide the line at the top:

.video-js .vjs-tech {
    top: -2px;
}

.video-js {
    overflow: hidden;
}

But yeah, that's a little cheeky.

网友答案:

The way I finally sorted out following ralph.m comments is as follow:

.video-js .vjs-tech {
  /* make the video larger so it can hide*/
  width: 102%;
  height: 102%;
  /* displace video to hide*/
  left: -5px;
  /* allow space for hiding*/
  margin: -10px;
  position: absolute;
  top: 0;
}

.video-js {
  /* make sure overflow is hidden*/
  overflow: hidden; 
}
相关阅读:
Top