Hướng dẫn html hide video - html ẩn video

Làm thế nào tôi có thể ẩn hoàn toàn các điều khiển video HTML5?

 

Sai không hoạt động - Điều này được thực hiện như thế nào?

Cheers.

Đã hỏi ngày 4 tháng 1 năm 2013 lúc 17:05Jan 4, 2013 at 17:05

Hướng dẫn html hide video - html ẩn video

Fred Randallfred RandallFred Randall

7.64923 Huy hiệu vàng85 Huy hiệu bạc192 Huy hiệu Đồng23 gold badges85 silver badges192 bronze badges

Như thế này:



1 là một thuộc tính boolean:

Lưu ý: Các giá trị "true" và "false" không được phép trên các thuộc tính boolean. Để biểu thị một giá trị sai, thuộc tính phải được bỏ qua hoàn toàn.

Andreas

15.7K12 Huy hiệu vàng71 Huy hiệu bạc70 Huy hiệu đồng12 gold badges71 silver badges70 bronze badges

Đã trả lời ngày 4 tháng 1 năm 2013 lúc 17:08Jan 4, 2013 at 17:08

9

Bạn có thể ẩn các điều khiển bằng các bộ chọn giả CSS như Demo: https://jsfiddle.net/g1rsasa3

//For Firefox we have to handle it in JavaScript 
var vids = $("video"); 
$.each(vids, function(){
       this.controls = false; 
}); 
//Loop though all Video tags and set Controls as false

$("video").click(function() {
  //console.log(this); 
  if (this.paused) {
    this.play();
  } else {
    this.pause();
  }
});
video::-webkit-media-controls {
  display: none;
}

/* Could Use thise as well for Individual Controls */
video::-webkit-media-controls-play-button {}

video::-webkit-media-controls-volume-slider {}

video::-webkit-media-controls-mute-button {}

video::-webkit-media-controls-timeline {}

video::-webkit-media-controls-current-time-display {}



Đã trả lời ngày 29 tháng 3 năm 2016 lúc 19:10Mar 29, 2016 at 19:10

11

Một giải pháp đơn giản là-chỉ để bỏ qua các tương tác của người dùng :-)

video {
  pointer-events: none;
}

Đã trả lời ngày 21 tháng 8 năm 2017 lúc 9:53Aug 21, 2017 at 9:53

Jakob Ejakob eJakob E

3.7701 Huy hiệu vàng17 Huy hiệu bạc17 Huy hiệu đồng1 gold badge17 silver badges17 bronze badges

1

Có hai cách để ẩn các điều khiển thẻ video

  1. Xóa thuộc tính

    
    
    1 khỏi thẻ video.

  2. Thêm CSS vào thẻ video

    video::-webkit-media-controls-panel {
    display: none !important;
    opacity: 1 !important;}
    

Đã trả lời ngày 23 tháng 2 năm 2021 lúc 5:28Feb 23, 2021 at 5:28

2

Trước hết, xóa thuộc tính "điều khiển" của video. Đối với iOS, chúng tôi có thể ẩn nút phát Buildin của video bằng cách thêm bộ chọn giả CSS sau:
For iOS, we could hide video's buildin play button by adding the following CSS pseudo selector:

video::-webkit-media-controls-start-playback-button {
    display: none;
}

Đã trả lời ngày 20 tháng 6 năm 2017 lúc 3:41Jun 20, 2017 at 3:41

AlanalaAlan

1512 Huy hiệu bạc6 Huy hiệu đồng2 silver badges6 bronze badges


Đã trả lời ngày 27 tháng 6 năm 2020 lúc 6:58Jun 27, 2020 at 6:58

1

Phương pháp này đã làm việc trong trường hợp của tôi.

video=getElementsByTagName('video');
function removeControls(video){
  video.removeAttribute('controls');
}
window.onload=removeControls(video);

Đã trả lời ngày 17 tháng 3 năm 2017 lúc 13:13Mar 17, 2017 at 13:13


0

Đã trả lời ngày 26 tháng 9 năm 2016 lúc 21:43Sep 26, 2016 at 21:43

1