Solved

HTML5 Embedded Movies

Posted on 2010-08-26
7
905 Views
Last Modified: 2012-05-10
I am currently running a WordPress website and would like to embed a video in the sidebar. I have customized the sidebar, so I am not using plugins. Currently, I am embedding a flash video, but I want to make the move to HTML5. I need a script to embed h264 videos for supported browsers and flash for non-supported browsers.

Also, I would like to integrate shadowbox with this. I have install shadowbox JS on WordPress and tried calling it via rel="shadowbox" but no joy.

Anyone care to assist?

Thanks
0
Comment
Question by:vertigogroup
  • 3
  • 3
7 Comments
 
LVL 10

Expert Comment

by:mstrelan
ID: 33539296
0
 
LVL 4

Expert Comment

by:senthilkumarsb
ID: 33541053
0
 

Author Comment

by:vertigogroup
ID: 33542391
OK. Everything is working fine except the fall back to flash. I have the flv file, but cannot get it to play in IE as a fall back. Here is my code:


<video controls width="300">
<source src="http://www.abc.com/test.ogg" type="video/ogg" />
<source src="http://www.abc.com/test.m4v" type="video/mp4" />
<embed src="http://www.abc.com/test.flv" type="application/x-shockwave-flash" width="300" height="181" allowscriptaccess="always" allowfullscreen="true"></embed>
</video>

Ideas?
0
PRTG Network Monitor: Intuitive Network Monitoring

Network Monitoring is essential to ensure that computer systems and network devices are running. Use PRTG to monitor LANs, servers, websites, applications and devices, bandwidth, virtual environments, remote systems, IoT, and many more. PRTG is easy to set up & use.

 

Author Comment

by:vertigogroup
ID: 33550884
Any ideas? I need to be able to have the videos play in all browsers and detect the browser automatically. So, mv4, flv, and ogg. Assistance is greatly appreciated. Right now, I can only get the video play in Safari and Chrome. I would like to add firefox and IE compatibility.

I know I could just use flash, but I want iPhone and iPad support.

Thanks!
0
 
LVL 10

Expert Comment

by:mstrelan
ID: 33551336
you cant embed an flv directly. you need a flash player. for example JW Player or FlowPlayer are big ones
0
 

Author Comment

by:vertigogroup
ID: 33551579
So, is the code below correct?


<video controls width="300">
<source src="http://abc.com/abc.ogg" type="video/ogg" />
<source src="http://abc.com/abc.m4v" type="video/mp4" />
<embed type="application/x-shockwave-flash" src="abc.com/flv-embed/flvplayer.swf" width="500" height="301" style="undefined" id="player1" name="player1" quality="high" wmode="transparent" allowscriptaccess="always" allowfullscreen="true" flashvars="height=301&amp;width=500&amp;file=http://abc.com/abc.flv&image=abc.com/abc.jpg&link=abc.com/abc.flv&callback=analytics">
</video>
0
 
LVL 10

Accepted Solution

by:
mstrelan earned 500 total points
ID: 33551616
you prob need a closing embed tag, as well as an object tag i think...try just getting the flash file working without the html5 video tags etc and then wrap it in video tags
0

Featured Post

NAS Cloud Backup Strategies

This article explains backup scenarios when using network storage. We review the so-called “3-2-1 strategy” and summarize the methods you can use to send NAS data to the cloud

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

I annotated my article on ransomware somewhat extensively, but I keep adding new references and wanted to put a link to the reference library.  Despite all the reference tools I have on hand, it was not easy to find a way to do this easily. I finall…
Building a website can seem like a daunting task to the uninitiated but it really only requires knowledge of two basic languages: HTML and CSS.
The purpose of this video is to demonstrate how to reset a WordPress password if you are locked out and cannot reset the password. A typical use would be if you cannot access the email to which WordPress would send the password recovery email to…
HTML5 has deprecated a few of the older ways of showing media as well as offering up a new way to create games and animations. Audio, video, and canvas are just a few of the adjustments made between XHTML and HTML5. As we learned in our last micr…

803 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question