What is the best syntax to express: "If I click this, this will happen but if it is not clicked, then another action will occur"? I want to keep CSS, HTML and JS separate, if possible.
I am trying to write code for "If I click this button, then the video will appear & play. But when it is not clicked, the video is hidden".
button = document.getElementByIdId('button')
video = document.getElementById('video')
button.addEventListener('click', function () {
(action here)
}
Add an event listener to your play button where it calls videoElem.play()
HTML:
<video id='video'>
<source src="your-video-source.mp4" type="video/mp4">
</video>
<button id='playVid'>Play</button>
Javascript:
document.getElementById('playVid').onclick = function () {
document.getElementById('video').play();
};