Presentation is loading. Please wait.

Presentation is loading. Please wait.

Dancing Life (舞動人生) 資工2B B 簡穎超

Similar presentations


Presentation on theme: "Dancing Life (舞動人生) 資工2B B 簡穎超"— Presentation transcript:

1 Dancing Life (舞動人生) 資工2B B97570106 簡穎超
網路程式設計 期末專案 Dancing Life (舞動人生) 資工2B B 簡穎超

2 網路程式設計 – 期末專案 個人網站主題:Dancing Life(舞動人生)
高中參加熱舞社後開始對跳舞感興趣,會在網路上蒐集相關的跳舞影片、音樂,或是觀看其他校的成發,也想藉由這個機會讓大家認識舞蹈。

3 網路程式設計 – 期末專案 網站架構圖

4 網路程式設計 – 期末專案 Home ( index.html ) 上方表單使用CSS a:hover功能使滑鼠移 過去改變顏色
右邊區塊為台灣 各大舞蹈工作室連結 中間圖片使用table 建立隱形表格,在旁邊 圍繞四種方向跑馬燈。 點選下方超連結 可以連到作者信箱。

5 網路程式設計 – 期末專案 Introduction ( intro.html ) 豐富的舞風簡介 每一種風格都有一 個影片,讓各位能夠
快速認識各種風格 右上方使用網頁標 籤可以快速瀏覽 右下方的圖片使用 javascript,能隨機更 換進入的圖。

6 網路程式設計 – 期末專案 Video ( video.html ) 辛苦蒐集的精選影片 使用Dom及javascript
例如:onclick event、 getElementById、 createElement、 appendChild等方法,呈現 出讓使用者點擊一張圖片 後可以出現對應的影片。

7 網路程式設計 – 期末專案 Music ( music.html ) 辛苦蒐集的精選音樂及封面 用table建立表格放入封面
嵌入youtube影片 使用Dom及javascript技術 例如: onclick event、getE lementById、createElement、 appendChild、replaceChild 等方法,呈現點選一張小圖後會 從小封面縮放到大封面的效果, 以及出現相對應的歌曲資訊。

8 網路程式設計 – 期末專案 About me ( aboutme.html ) 關於個人的照片以及 聯絡方式 右方的輕鬆小品使用
Javascirpt所寫的數字 拼圖遊戲 下方有意見留言箱, 使用input button submit跟clear資料。

9 網路程式設計 – 期末專案 The End


Download ppt "Dancing Life (舞動人生) 資工2B B 簡穎超"

Similar presentations


Ads by Google