saaniya
(saaniya)
April 23, 2015, 6:39am
1
Hi:
I want a video to play when my page loads. And its ok if it keeps playing in a loop too. Is that possible?
I tried the following code. Replaced the type in bold with my video file name from server. It didnt work at all. I even kept the Position: relative and Overflow: Hidden
<video autoplay loop style="width:100%; height: auto; position:absolute; z-index: -1;">
<source src="http://syddev.com/jquery.videoBG/**assets/tunnel_animation.mp4**" type="video/mp4" />
<source src="http://syddev.com/jquery.videoBG/**assets/tunnel_animation**.ogv" type="application/ogg" />
<img src="http://syddev.com/jquery.videoBG/assets/tunel_animation.jpg">
</video>
Best
saaniya
vincent
(Vincent Bidaux)
April 23, 2015, 9:54am
2
Hi in order for the code to work your urls to videos have to work. And for instance your urls don’t.
http://syddev.com/jquery.videoBG/**assets/tunnel_animation.mp4 ** this doesn’t work
replace it by http://syddev.com/jquery.videoBG/assets/tunnel_animation.mp4
and try again (:
AlexN
(Alex Nichol)
April 23, 2015, 11:55am
3
Can you tell me more about what is not working? What system and browser are you using?
saaniya
(saaniya)
April 23, 2015, 4:37pm
4
Hey guys: Thanks for responding.
Dropbox link: Dropbox - Error
Google Chrome: Version 42.0.2311.90 (64-bit)
MacBook Pro (Retina, 15-inch, Early 2013)
Processor: 2.7 GHz Intel Core i7
Memory: 16 GB 1600 MHz DDR3
Graphics: Intel HD Graphics 4000 1024 MB
saaniya
(saaniya)
April 23, 2015, 4:40pm
5
Here is the code I tried then:
<video autoplay loop style="width:100%; height: auto; position:absolute; z-index: -1;">
<source src="http://syddev.com/jquery.videoBG/http://www.dropbox.com/s/tb1p89zg9jvdkqn/Example.mp4?dl=0" type="video/mp4" />
<source src="http://syddev.com/jquery.videoBG/http://www.dropbox.com/s/tb1p89zg9jvdkqn/Example.mp4?dl=0.ogv" type="application/ogg" />
</video>
vincent
(Vincent Bidaux)
April 23, 2015, 4:41pm
6
As I said before, your video links have work on a browser and link to the real file for the code to work later.
So for example, your link:
Dropbox - Error doesn’t link to the file but to a video player on the Dropbox site. For your link to link the actual file, change the url to this:
http://dl.dropboxusercontent.com /s/tb1p89zg9jvdkqn/Example.mp4
vincent
(Vincent Bidaux)
April 23, 2015, 4:43pm
7
remove
http://syddev.com/jquery.videoBG/
change
http://www.dropbox.com/s/tb1p89zg9jvdkqn/Example.mp4
to
http://dl.dropboxusercontent.com/s/tb1p89zg9jvdkqn/Example.mp4
1 Like
saaniya
(saaniya)
April 23, 2015, 4:52pm
8
Thanks, Vincent. It works. I will try it with my actual video now and see. I have another quick query regarding centering of left aligned text & it being responsive. Will start another thread under a new topic for that.
Thanks
Saaniya
AlexN
(Alex Nichol)
April 23, 2015, 4:58pm
9
@vincent has got it right to get the video to play.
I was thrown off by the first bold comment because you were trying to bold pre-formatted text which looks like this
**bold**
If you are experiencing strange positioning behavior I would remove the position:absolute; z-index:-1
code and apply a class and the styling you want to the embed widget.
saaniya
(saaniya)
April 23, 2015, 5:06pm
10
Thank you both, Vincent & David. I was able to make the video work well. appreciate the help
vincent
(Vincent Bidaux)
April 23, 2015, 6:03pm
11
David I had to reformat saaniyas posts because all the code has to be formatted, unless it doesn’t appear at all in the forum