Copy link to clipboard
Copied
I am having problems with my video file not showing online!
<!doctype html>
<html lang="en-US">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Light Theme</title>
<link href="css/singlePageTemplate.css" rel="stylesheet" type="text/css">
<script>var __adobewebfontsappname__="dreamweaver"</script>
<script src="http://use.edgefonts.net/source-sans-pro:n2:default.js" type="text/javascript"></script>
</head>
<body>
<div class="container">
<header> <a href="index.html">
<h4 class="logo"><img src="IMAGES/LOGO_NEW.png" width="250" height="127" alt=""/></h4>
</a>
<nav>
<ul>
<li>
<h2><a href="index.html">HOME</a></h2>
</li>
<li>
<h2><a href="about.html">ABOUT</a></h2>
</li>
<li>
<h2><a href="work.html">WORK</a></h2>
</li>
<li>
<h2><a href="contact.html">CONTACT</a></h2>
</li>
</ul>
</nav>
</header>
<section id="hero">
<h1 class="hero_header"> </h1>
<h1 class="hero_header"> </h1>
<h1 class="hero_header" style="font-style: inherit; font-size: 18px;"> </h1>
<h1 class="hero_header" style="font-style: inherit; font-size: 18px;"> </h1>
<h1 class="hero_header" style="font-style: inherit; font-size: 24px;">WORK </h1>
<p> </p>
<div align="center">
<span class="style2" style="font-size: smaller; color: rgba(6,248,224,1);" align="center">VFX Demo Reel </span><span style=""><br />
</span></div>
<p align="center"><object width="640" height="496" classid="clsid:CFCDAA03-8BE4-11cf-B84B-0020AFBBCCFA" codebase="http://www.apple.com/qtactivex/qtplugin.cab">
<param name="src" value="video/VFX_demo_reel_09_03.mov">
<pram name="target" value="myself">
<param name="autoplay" value="false">
<param name="controller" value="true">
<param name="type" value="mp4" width="640" height="496">
<embed src="VIDEO/BluntImage.mp4" width="640" type="video/quicktime" height="496" autoplay="false" controller="true"></embed>
</pram></object>
</p>
<div align="center">
<span class="style2" style="font-size: smaller; color: rgba(6,248,224,1);" align="center">in Development</span><br />
</div>
<p align="center"><object width="640" height="496" classid="clsid:02BF25D5-8C17-4B23-BC80-D3488ABDDC6B" codebase="http://www.apple.com/qtactivex/qtplugin.cab">
<param name="src" value="video/VFX_demo_reel_09_03.mov">
<pram name="target" value="myself">
<param name="autoplay" value="false">
<param name="controller" value="true">
<param name="type" value="video/quicktime" width="640" height="496">
<embed src="video/VFX_demo_reel_09_03.mov" width="640" height="496" autoplay="false" controller="true" pluginspage="http://www.apple.com/quicktime/download/" type="video/quicktime"></embed>
</object></p>
<p> </p>
<p><br /></p>
<table class="style1" cellpadding="20" width="560">
<tr>
<td align="center" valign="top"><img height="62" width="103" src="IMAGES/TriStar_logo.jpeg" /><br /><br />
TriStar
</td>
<td align="center" valign="top"><p><img height="48" width="202" src="IMAGES/TBN_logo_2015.jpg" /><br /><br/>
TBN</p>
<p> </p></td>
<td align="center" valign="top"><img height="71" width="227" src="BBC-logo.png" /><br /><br />
BBC</td>
<td align="center" valign="top" style="text-align: center"><img height="87" width="71" src="IMAGES/th.jpeg" /><br />
SONY
</td>
</tr>
</table>
<p style="text-align: center"><a href="mailto[email address removed by Mod]"><strong>EMAILTO</strong></a>: BluntImage</p>
<p><br />
</p>
Copy link to clipboard
Copied
I prefer to upload the video to the likes of YouTube. This way, the correct format will be served to the client. Have a look at Alt-Web Design & Publishing: Responsive Videos in Bootstrap 3​. Ignore the Bootstrap bit if that is not what you want.
Copy link to clipboard
Copied
The <object><embed> method for putting video online is obsolete. MOV files require the Quicktime plug-in and browsers are moving away from plug-ins all together. Firefox 52 dumps all plug-ins aside from Flash for example, because native browser support for video files exists now.
To add videos to a website, you should now be using MP4 files, the html5 doctype and the html5 <video> tag instead of the old <object><embed> method.
Copy link to clipboard
Copied
Don't use MOV. it's obsolete. Apple stopped developing QuickTime player last year. As Ben and Jon said, use MP4 with the native HTML5 <video> tag. All browsers and mobile devices support HTML5 <video> now.
<!--begin video-->
<video controls poster="Your_Poster_Image.jpg">
<!--Replace sample-video with your own MP4 file-->
<source src="http://techslides.com/demos/sample-videos/small.mp4" type="video/mp4">
<!--end video--></video>
Nancy