How to stop playing video in html5 video
html5 video method to stop playing a video: first use "document.getElementById("id value")" to obtain the video object; then use the "video object.pause()" statement to stop (pause) the currently playing video Just video.
The operating environment of this tutorial: windows7 system, HTML5&&javascript version 1.8.5, Dell G3 computer.
html5 videoStop playing video
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
</head>
<body>
<div style="text-align:center">
<button onclick="playPause()">播放/暂停</button>
<br><br>
<video id="video1" width="420">
<source src="mov_bbb.mp4" type="video/mp4">
<source src="mov_bbb.ogg" type="video/ogg">
您的浏览器不支持 HTML5 video 标签。
</video>
</div>
<script>
var myVideo=document.getElementById("video1");
function playPause()
{
if (myVideo.paused)
myVideo.play();
else
myVideo.pause();
}
</script>
</body>
</html>Rendering:
Related function description:
play() method starts playing the current audio or video.
pause() method stops (pauses) the currently playing audio or video.
For more programming related knowledge, please visit: Programming Video! !
The above is the detailed content of How to stop playing video in html5 video. For more information, please follow other related articles on the PHP Chinese website!
Hot AI Tools
Undress AI Tool
Undress images for free
Undresser.AI Undress
AI-powered app for creating realistic nude photos
AI Clothes Remover
Online AI tool for removing clothes from photos.
Clothoff.io
AI clothes remover
Video Face Swap
Swap faces in any video effortlessly with our completely free AI face swap tool!
Hot Article
Hot Tools
Notepad++7.3.1
Easy-to-use and free code editor
SublimeText3 Chinese version
Chinese version, very easy to use
Zend Studio 13.0.1
Powerful PHP integrated development environment
Dreamweaver CS6
Visual web development tools
SublimeText3 Mac version
God-level code editing software (SublimeText3)
What are HTML5 data attributes?
Aug 06, 2025 pm 05:39 PM
HTML5dataattributesarecustom,validHTMLattributesusedtostoreextrainformationinelementsforJavaScriptorCSS.1.Theyaredefinedasdata-*attributes,likedata-user-id="123".2.Theyallowembeddingprivate,customdatadirectlyinmarkupwithoutaffectinglayoutor
What are the supported audio formats in HTML5?
Aug 05, 2025 pm 08:29 PM
HTML5 audio format support varies from browser to browser. The most commonly used formats include: 1.MP3 (.mp3, audio/mpeg, supported by all mainstream browsers, with the best compatibility); 2.WAV (.wav, audio/wav, support better but large files, suitable for short audio); 3.OGG (.ogg/.oga, audio/ogg, Chrome, Firefox, Opera support, Safari and IE are not supported, open source free); 4.AAC (.aac/.m4a, audio/aac, Safari, Chrome, Edge support, Firefox support is limited, often used in Apple devices). To ensure compatibility, the
How to use the canvas API for basic drawing in HTML5?
Aug 07, 2025 am 07:15 AM
To use HTML5Canvas API for basic drawing, first create the canvas element in HTML and set the width and height attribute, and then get its 2D rendering context through JavaScript; 1. Use fillRect, strokeRect and clearRect to draw and clearRect; 2. Create paths and draw lines or custom shapes through beginPath, moveTo, lineTo and closePath; 3. Use arc to draw circles or arcs; 4. Use fillText and strokeText to add fill or stroke text; 5. Set fillStyle, strokeStyle, lin
What is the doctype in HTML5?
Aug 06, 2025 am 01:15 AM
It is a necessary tag used in HTML5 to declare document types and must be located at the beginning of the document; its function is to ensure that the browser renders the page in standard mode to avoid compatibility issues caused by the lack of declarations; the declaration is concise, case-insensitive and does not require reference to DTD; correct use can ensure the expected behavior of HTML, CSS and JavaScript.
How to create a simple HTML5 webpage
Aug 12, 2025 am 11:51 AM
To create a simple HTML5 web page, you need to first use the declaration document type, and then build a basic structure containing, and, which sets the character encoding, viewport and title, add visible content such as title, paragraph, link, pictures and lists. Save it as a .html file and open it directly in the browser for viewing, without server support. This is the basis of a complete and effective HTML5 page.
What is the aside element for in HTML5?
Aug 12, 2025 pm 04:37 PM
Theelementshouldbeusedforcontenttangentiallyrelatedtothemaincontent,suchassidebars,pullquotes,definitions,advertisements,orrelatedlinks;2.Itcanbeplacedinsideoroutsideanarticledependingoncontext;3.ItisasemanticelementthatenhancesaccessibilityandSEObyp
What is the readonly attribute in HTML5?
Aug 08, 2025 am 11:55 AM
ThereadonlyattributeinHTML5makesforminputsnon-editablewhilestillallowingsubmissionanduserinteraction;1.Itappliestoandelements;2.Itisabooleanattribute,soonly"readonly"needstobepresent;3.Unlike"disabled",itallowsfocusandthedataisinc
How to create a color picker in an HTML5 form?
Aug 08, 2025 am 03:48 AM
Use type="color" to create an HTML5 color selector, 1. Use add color input; 2. You can set the default color value through the value attribute (must be in a 7-character hexadecimal format such as #ffffff); 3. All modern browsers support it, and older browsers will fall back to text input; 4. You can preview color changes in real time with JavaScript; 5. Label tags should be added to improve accessibility, and JavaScript library can be used to provide downgrade support when necessary. This method is simple, effective and widely supported.
