I have a html video where i have image which loads initially. and that image dissapear and play that video.

I want the image should always appear,unill i click on the image. Once i click on the image, video should play.

Please find the jsfiddle:

/

We have tried autoplay = "" and also removing autoplay from the video tag but no joy.

What change i need to make, if i want to play the video on click of image?

I have a html video where i have image which loads initially. and that image dissapear and play that video.

I want the image should always appear,unill i click on the image. Once i click on the image, video should play.

Please find the jsfiddle:

http://jsfiddle/pwxcvxe8/173/

We have tried autoplay = "" and also removing autoplay from the video tag but no joy.

What change i need to make, if i want to play the video on click of image?

• javascript
• jquery
• html
• css

Share Improve this question Follow asked Dec 19, 2016 at 6:40 SmartestVEGASmartestVEGA 8,9292828 gold badges9595 silver badges150150 bronze badges 1

• possible duplicate of stackoverflow./questions/20286541/… – ADH - THE TECHIE GUY Commented Dec 19, 2016 at 6:48

Add a ment  | 

5 Answers 5

Sorted by: Reset to default 2

Removing the autoplay from the <video> tag worked fine to stop it autoplaying.
To make it so the image plays when you click, use the following jQuery:

$('#vid').click(function() {
  $('#vid').get(0).play()
});

Here is an updated JSFiddle

---

Feel free to ask any questions.

try removing autoplay="false" or just remove autoplay property

Try adding autoplay="false" or delete the autoplay. This worked for me.

Hope this will help.

Here is Updated Code, You Can Remove autoplay attribute from video element, so it will never play autoplay, apart from that if you need to stop autoplay through script you can register event on it and use Dom Method "element.pause()" to stop the video here

Taken from the MDN Web Docs https://developer.mozilla/en-US/docs/Web/HTML/Element/video "The autoplay attribute has precedence over preload. If autoplay is specified, the browser would obviously need to start downloading the video for playback."

1. As answered above (by Zac Webb) remove the attribute autoplay.
2. And if you have the attribute preload make sure it is set to none preload="none", since the default for this attribute is auto.

This worked for me.