有一个关闭按钮粘在视频的右上角

时间:2013-09-16 20:28:03

标签: html css

首次访问我的页面时,我有一个全屏播放的视频。我想在右上角有一个关闭按钮,但我只能将它保存在窗口的右上角而不是实际的视频

JSFIDDLE

  <div id="vid">
   <a href="#" class="close_vid"/></a>
   <video  width="100%" height="100%" autoplay>
   <source src="aa.ogg" type="video/ogg">
   <source src="aa.mp4" type="video/mp4">
   <source src="aa.webm" type="video/webm">
   <object data="aa.mp4"  width="100%" height="100%">
   <embed  width="100%" height="100%" src="movie.swf">
  </object>
 </video>
</div>  

我的CSS

#vid {
 background-color: black;
 clear: both;
 float: left;
 height: 100%;
 list-style: none outside none;
 position: relative;
 width: 100%;
 z-index: 900;
}

#vid .close_vid {
 background: url(icons/zoom-on.png) no-repeat;
 top: 6px;
 cursor: pointer;
 height: 290px;
 opacity: 1;
 position: absolute;
 width: 29px;
 z-index: 999;
 right: 5px;
}

1 个答案:

答案 0 :(得分:0)

#vid .close_vid {
    position: relative;
}