How to disable "full screen" of html5 video in any browser?

0

How can I disable full screen in any browser?

Follow the image where it has a red circle:

Any solution?

    
asked by anonymous 14.04.2017 / 07:03

2 answers

1

CSS controls are these: Enjoy:)

video::-webkit-media-controls-fullscreen-button {
    display: none;
}
video::-webkit-media-controls-play-button {}
video::-webkit-media-controls-play-button {}
video::-webkit-media-controls-timeline {}
video::-webkit-media-controls-current-time-display{}
video::-webkit-media-controls-time-remaining-display {}
video::-webkit-media-controls-time-remaining-display {}
video::-webkit-media-controls-mute-button {}
video::-webkit-media-controls-toggle-closed-captions-button {}
video::-webkit-media-controls-volume-slider {}
<video width="400" height="260" controls="">
    <source src="http://cdn.papercut.com/video/home/home2.mp4"type="video/mp4" />
        <source src="http://clips.vorwaerts-gmbh.de/VfE.webm"type="video/webm" />
        <source src="http://clips.vorwaerts-gmbh.de/VfE.ogv"type="video/ogg" />
</video>
    
14.04.2017 / 13:47
0

For this I would have to use javascript also along with HTML5, just as I will put below will work:

<!DOCTYPE html>
<html lang="pt-BR">
<head>
    <meta charset="UTF-8">
    <title>Teste Video</title>
</head>
<body>


<div style="text-align:center">
    <button onclick="playPause()">Play/Pause</button>
    <br><br>
    <video id="video1" width="420">
        <source src="p360-2.mp4" type="video/mp4">
    </video>
</div>

<script>
    var myVideo = document.getElementById("video1");

    function playPause() {
        if (myVideo.paused)
            myVideo.play();
        else
            myVideo.pause();
    }


</script>

</body>
</html> 
    
14.04.2017 / 07:43