CODEWITHSUNDEEP
jqueryhtml
vlk
vlk

Reputation: 1454

Change src video attribute with jquery

I'm trying this solution to change video src with jquery but it doesn't work. It still load the html inline video source.

HTML:

  <video id="lanvid" autoplay  class="lanvid"
   poster="img/Nuraghes_main.jpg" id="bgvid2"  loop >
        <source id="mp4Source" src="img/clouds.mp4" />        
  </video>

JQUERY

$(document).ready(function() {

var player = document.getElementsById('lanvid');
var mp4vid = document.getElementsById('mp4Source');

player.pause();

$(mp4Vid).attr('src', "img/about.mp4");

  player.load();
  player.play();


  });

Upvotes: 0

Views: 450

Answers (1)

NopalByte
NopalByte

Reputation: 159

First not exist the method: "document.getElementsById", the correct method is "document.getElementById" without the "s" in the word "Element".

Second, the selector "mp4Vid" is not equal to "mp4vid", the "V" is different "v", javascript is case sensitive, therefore your code should be:

$(document).ready(function() {

var player = document.getElementById('lanvid');
var mp4vid = document.getElementById('mp4Source');

player.pause();

$(mp4vid).attr('src', "img/about.mp4");

player.load();
player.play();

});

on the other hand, a better way to do this is:

$(document).ready(function() {
var player = document.getElementById('lanvid');

player.pause();

$('#mp4Source').attr('src', "img/about.mp4");

player.load();
player.play();

});

Upvotes: 1

Related Questions