如何使 HTML5 幻燈片

HTML5，作為下一代網路標準，在拐角處。你會將 HTML5 支援添加到您的網站?也許它是至少準備時間。這篇文章將告訴你 2 如何使 HTML5 幻燈片嵌入到您的網站。

自運行 HTML5 幻燈片

HTML5 的最大升級之一是你可以直接嵌入並通過使用播放線上視頻。這種方式，遊客可以觀看 HTML5 幻燈片，只要他們的瀏覽器支援 HTML5。沒有所需的 Flash 播放機。因為 HTML5 尚未到其最終版本，視頻編解碼器可能可以使用 WebM、 H264、 吊架或兩者。

這裡是如何你可以嵌入幻燈片 HTML5 視頻:

< 視頻 poster="movie.jpg"控制項 >
< 源 src='movie.webm' 類型 =' 視頻/webm;編解碼器 ="vp8.0，vorbis"' / >
< 源 src='movie.ogv' 類型 =' 視頻/ogg;編解碼器 ="theora，vorbis"' / >
< 源 src='movie.mp4' 類型 =' 視頻/mp4;編解碼器 ="avc1.4D401E、 mp4a.40.2"'/ >
</視頻 >

如果你能看到下面的視頻，您的 web 瀏覽器支援 HTML5，太。如今，大多數瀏覽器已經支援 HTML5 的幻燈片。請參閱有關 HTML5 瀏覽器的更多詳細資訊。

HTML5 創建的幻燈片顯示視頻與DVD Slideshow Builder Deluxe -包括超過 100 過渡。

現在你需要什麼只是 HTML5 幻燈片軟體並創建幻燈片視頻格式MP4 (AVC) 。

互動式的 HTML5 幻燈片

像在網站上目前使用 Flash 投影片放映，還可以設計 HTML5 幻燈片沒有安裝任何東西。當然，你不必自己編寫的編解碼器。在這裡我們採取廣泛共用的 HTML5 放映幻燈片線上示例向您展示如何將嵌入到 HTML5 幻燈片。

1.將檔放在正確的地方。

當你從這裡下載 HTML5 專案檔案時，解壓到您的電腦、 檔和移動或上載到您的網站的資料夾。

也有其他人來分享他們在網上的幻燈片 HTML5 專案。谷歌一和變化以適應您的需要。它是更好地把版權通知感謝別人的工作，或遵循的許可聲明。

2.更改代碼以滿足您的需求

通常，您不需要更改 css 和 js 檔，除了連結位址的代碼，如果你有放在不同的資料夾中。例如，應將 css 檔連結位址更改為 'scripts/script.js'，如果你已經到現有資料夾中稱為 '腳本' 的 script.js 檔。這種類型的連結位址稱為相對連結，而另一種類型是絕對的鏈路，如 HTTP://yoursite.com/scripts/script.js。如果 HTML5 幻燈片嵌入到一個資料夾中的頁，則應使用類似 '。/scripts/script.js。如果你不熟悉的差異，更好地將使用絕對連結。

這個 HTML5 幻燈片的最重要部分被標記在紅色的盒子裡。將這些代碼複製到你想要 HTML5 幻燈片可顯示和更改圖像位址像任何頁上文所述。

點擊放大。

3.與 HTML5 瀏覽器預覽

最後，請參閱如何 HTML5 幻燈片顯示看起來像在 HTML5 瀏覽器中。通常，您將獲得這個 HTML5 幻燈片。在頁面上，您也可以下載 HTML5 幻燈片檔，看看詳細設計過程，它由馬丁 · 安格洛夫。

也可查閱Flash 幻燈片範本網站幻燈片進行點擊。