網路程式設計專題

痞子英雄

網路程式設計專題

用了哪些技術DOM 、 Event 、 javascript ， css

網頁地圖

分頁

<html xmlns = "http://www.w3.org/1999/xhtml"> <head> <title>nav </title> <style type="text/css"> body{background-color:} div {color:gray} </style> <body> <h1 style="color:white"><a href="photo.html" target="main">圖片 </a><br/> <a href="story.html" target="main">故事 </a><br/> <a href="links.html" target="main">相關連結 </a><br/> <a href="character.html" target="main">人物 </a><br/> <a href="main.html" target="main">回首頁 </a><br/></h1>

</body> </html>

←CSS

<script type="text/javascript">

var current= new Date(); document.writeln("現在時間 :"+ current.toLocaleString() ); var seconds = 0; function startTimer() { window.setInterval( "updateTime()", 1000 ); }　　 function updateTime() { ++seconds; document.getElementById( "soFar" ).innerHTML = seconds; }　　　</script> <img src="photo/top_banner_.jpg" /><br/>

</head> <body onload = "startTimer()"> <p>您已經在此網站停了 : <strong id = "soFar">0</strong> 秒 </p> <img src="photo/海港城 .jpg" />

← event

<head> <title>INDEX</title>

</head> <frameset cols="200,*"> <frame name ="leftframe" src ="nav.html"/> <frame name ="main" src ="main.html"/> <noframes> <body> <p><a href="nav.html"></a></p> </body> </noframes> </frameset>

function run()

{

count += speed;

if ( count >= 450 )

{

window.clearInterval( interval );

interval = null;

}

var bigImage = document.getElementById( "imgCover" );

bigImage.style.width = count + "px";

bigImage.style.height = .7656 *count + "px";

}

function display( imgfile )

{

if ( interval )

return;

var bigImage = document.getElementById( "imgCover" );

var newNode = document.createElement( "img" );

newNode.id = "imgCover";

newNode.src = "fullsize/" + imgfile;

newNode.alt = "Large image";

newNode.className = "imgCover";

newNode.style.width = "0px";

newNode.style.height = "0px";

bigImage.parentNode.replaceChild( newNode, bigImage );

count = 0; // start the image at size 0

interval = window.setInterval( "run()", 10 ); // animate

DOM

}

</script>

</head>

<body>

<div id = "mainimg" class = "mainimg">

<img id = "imgCover" src = "fullsize/2009412184839.jpg"

alt = "Full cover image" class = "imgCover" />

</div>

<div id = "thumbs" class = "thumbs" >

<img src = "thumbs/2009412184839.jpg" alt = "2009412184839"

onclick = "display( '2009412184839.jpg' )" />



<img src = "thumbs/U2519P28T3D2246034F326DT20081111201633.jpg" alt = "U2519P28T3D2246034F326DT20081111201633"

onclick = "display( 'U2519P28T3D2246034F326DT20081111201633.jpg' )" />







</div>

</body>

CSS

<style type="text/css"> body{background-color:} a.nodec{text-decoration:none} a:hover{background-color:yellow} </style> <body> <a class="nodec"

href="http://www.pts.org.tw/~web03/ruffian_hero/index1.htm" >公視《痞子英雄》官網

</a><br/> <a class="nodec" href="http://www.prajnaworks.com/" >普拉嘉國際意像影藝《痞子英雄》官方網站

</a><br/> <a class="nodec"

href="http://www.wretch.cc/blog/prajnaworks" >普拉嘉國際意像影藝《痞子英雄》官方部落格

</a><br/> <a class="nodec" href=" http://www.prajnaworks.com/discuz/" > 普拉嘉國際意像影藝《痞子英雄》官方論壇

</a><br/> <a class="nodec" href="finalreport.ppt">投影片下載</a> </body>

Documents

網路程式設計專題