如果覺得不清楚可以在這裡看
圖片 這是我在測試HTML5的video teg時發生的問題
影片一直都無法撥放
奇怪的是
如果直接指定用Firefox來開啟影片卻可以解析
如圖開啟影片的方式是在第一張圖的影片播放(有個灰叉叉的黑色格子)範圍點選右鍵選擇撥放影片
網頁原始碼如下
紅色的區塊是影片撥放的語法
<!DOCTYPE HTML>
<html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <title>New Web-Tec</title> <link rel="shortcut icon" href="pic/favicon.png" type="image/x-icon"/> <link rel="icon" href="pic/favicon.png" type="image/x-icon"/> <link href="lib/main.css" rel="stylesheet" type="text/css" /> <script src="lib/jquery.js"></script> <script src="lib/menu_control.js"></script> <style> a.anchor{ text-decoration:underline; }
</style>
<script> $(document).ready(function(){ /* 調整現在的頁面選單 */ $('#web_tec_introduction').addClass('current_page'); }); </script> </head> <body> <div class="container"> <header>關於網頁技術的新標準與技術的未來趨勢與發展</header> <div class="midddle"> <!-- Start .sidebar1 --> <div class="sidebar1">
<div class="nav">
<div class="menuhead" onmouseover="menuon(1)" onmouseout="menuoff(1)"><a href="/html5/web_tec_introduction.php" id="introduction">簡介</a> <div class="submenu" id="submenu1"><a href="web_tec_introduction.php" id="web_tec_introduction">網頁技術簡介</a><a href="#" id="browser_os_introduction">瀏覽器發展簡介</a></div></div& gt; <div class="menuhead" onmouseover="menuon(2)" onmouseout="menuoff(2)"><a href="/html5/web_tec_introduction.php" id="Future_trends">未來趨勢</a> <div class="submenu" id="submenu2"><a href="#" id="Web2~3">Web2.0-Web3.0</a><a href="#" id="HTML5_introduction">HTML5概要</a></div></div> <div class="menuhead" onmouseover="menuon(3)" onmouseout="menuoff(3)"><a href="/html5/web_tec_introduction.php" id="tec-section">技術細節</a>
<div class="submenu" id="submenu3"><a href="#" id="newthing_inHTML5">HTML5新功能</a><a href="#" id="about_XML">XML</a><a href="#" id="RSS_ATOM">RSS & ATOM</a><a href="#" id="AJAX">AJAX</a></div></div>
<div class="menuhead" onmouseover="menuon(4)" onmouseout="menuoff(4)"><a href="/html5/web_tec_introduction.php" id="demo">實際範例</a> <div class="submenu" id="submenu4"><a href="#" id="movie_player">影片撥放器</a></div></div> </div> <!-- end .sidebar1 -->
</div>
<!-- end .sidebar1 --> <div class="content"> <h1>網頁技術簡介</h1> <p>網頁技術依照不同的區分標準有不同的分類法，這裡舉兩種簡單的區分方式為例子：</p> <ul> <li> 依照網頁呈現原理區分： <ul>
<li><a class="anchor no_style_link" href="#change_webpage">動態網頁技術</a></li>
<li><a class="anchor no_style_link" href="#static_webpage">靜態網頁技術</a></li> </ul> </li> <li> 依照程式碼解析端區分： <ul> <li><a class="anchor no_style_link" href="#sever_webpage">伺服器端網頁技術</a></li>
<li><a class="anchor no_style_link" href="#broswer_webpage">瀏覽器端網頁技術</a></li>
</ul> </li> </ul> <h2 id="static_webpage">靜態網頁技術</h2>
<video controls="controls">
<source src="audio/ss.theora.ogv"></source> </video> <video src="audio/ss.webmvp8.webm" controls="controls" width="300" height="150"></video> <h2 id="change_webpage">動態網頁技術</h2>
<p></p> <h2 id="static_webpage">靜態網頁技術</h2> <p> </p> <h2 id="static_webpage">靜態網頁技術</h2> <p> </p> <!-- end .content -->
</div>
</div> <footer> <p> We support Firefox 3.6+, IE 8+, Safari 4.0+, Chorme 5.0+. Pixel 1024 x 768 is Recommended. </p> </footer> <!-- end .footer --> <!-- end .container --></div>
</body>
</html>
登入
註冊
問答集
搜尋
