不過張貼文章以及檔案分享卻還是在這種網頁的介面下較為便利
2008年1月7日 星期一
Lab Packet sniffer
原本的ethereal 無法安裝 故改使用wireshark
安裝好之後 選擇capture =>interface
會看見你這台電腦的網卡選好對應的網卡之後點選START
即可開始偵測封包
此圖為連線上電機心站封包的狀況
安裝好之後 選擇capture =>interface
會看見你這台電腦的網卡選好對應的網卡之後點選START
即可開始偵測封包
此圖為連線上電機心站封包的狀況
2007年12月31日 星期一
期末報告:Drag And Drop
我所選的是 Drag And Drop 因為眾所週知的google 在她推出的igoogle中
就提供了類似的的拖曳功能，這樣的功能提供了高度的互動性及自由度`,所以我很感興趣。
以下為整段程式碼
分析如下
在一開始第3行的
simplelayout
axis="x" => 物件延著X軸放置
spacing="5" => 每個物件建個5個像素
spacing="5" => 每個物件建個5個像素
接下來的4~14行是構成我們畫面上的wish與shopping兩個cart也就是下圖兩個黃色所標示的範圍
fgcolor="#FFFFFF"=>設定這個物件的前景色
bgcolor="#666699" =>設定這個物件的背景色
我們也可以發現這兩個cart中間有間隔就是前面simplelayout的效果。
接下來的16~32行就是整個Drag And Drop 最重要的部份。在這部分我們建立了我們要進行拖曳動作的物件以及一些相關處理他的作法
我們要進行拖曳的物件為norahjones.jpg這張圖，以resouce將他引入進來。
在第18,19行就是控制拖曳的方法
接下來的16~32行就是整個Drag And Drop 最重要的部份。在這部分我們建立了我們要進行拖曳動作的物件以及一些相關處理他的作法
我們要進行拖曳的物件為norahjones.jpg這張圖，以resouce將他引入進來。
在第18,19行就是控制拖曳的方法
onmousedown="dragging.apply()" =>當滑鼠按下時，可以拖曳物件
onmouseup="dragging.remove(); stop() =>當滑鼠放開，拖曳的效果解除並stop
onmouseup="dragging.remove(); stop() =>當滑鼠放開，拖曳的效果解除並stop
關於stop的動作在後面會有更詳細的設定。
dragstate 是她預設好用來控制drag相關動作的東西，再這邊還可加入一些相關的參數 去設定你要拖曳的範圍限制比如說控制它只能做水平或垂直的表現。或者更近一步限制他只能在某個範圍最小多少，最大到多少。
第23行到第31行中
描述的是當我們鬆開滑鼠物件要停止下來的一些相關設定，為了讓物件只能在我們指定的範圍停下來而做此設計
宣告一個 method取名為stop
this所指向的物件就是我們所拖曳的物件，this.x就是我們拖曳物件的x座標，當他超過某個wish的範圍直接將物件定位在25 ,26行所標示的位置(也就是wish所在的範圍)。反之定位在28,29行所描述的位置(也就是cart所在的範圍)。
總結
在這個範例中我們可以學到基本畫面的佈局的設計方法(simplelayout)，以及拖曳控制的方法(dragstate)。另外還有滑鼠事件的描述(onmouseup,onmousedown)
dragstate 是她預設好用來控制drag相關動作的東西，再這邊還可加入一些相關的參數 去設定你要拖曳的範圍限制比如說控制它只能做水平或垂直的表現。或者更近一步限制他只能在某個範圍最小多少，最大到多少。
第23行到第31行中
描述的是當我們鬆開滑鼠物件要停止下來的一些相關設定，為了讓物件只能在我們指定的範圍停下來而做此設計
宣告一個 method取名為stop
this所指向的物件就是我們所拖曳的物件，this.x就是我們拖曳物件的x座標，當他超過某個wish的範圍直接將物件定位在25 ,26行所標示的位置(也就是wish所在的範圍)。反之定位在28,29行所描述的位置(也就是cart所在的範圍)。
總結
在這個範例中我們可以學到基本畫面的佈局的設計方法(simplelayout)，以及拖曳控制的方法(dragstate)。另外還有滑鼠事件的描述(onmouseup,onmousedown)
2007年12月17日 星期一
Homework 12-10-2007
1. List three ways of creating interactive webpages.
a.PHP
一種嵌入在Html中的語言 最早是 由Rasmus Lerdorf ，他用Perl寫了一些後端的程式，記錄有哪些人看過他的線上履歷表。慢慢地，一些網友對他所寫的程式碼產生興趣。於是，Rasmus Lerdorf就整理這些程式碼，包裝成一個叫作 Personal Home Page Tools基於個人的興趣，Rasmus Lerdorf又寫了一個腳本語言的核心引擎。然後，又加上了能處理HTML表單輸入的工具，稱作 “Form Interpreter”簡稱FI。在1995年完成的這個版本，當時稱作 “PHP FI”，也有人稱之為 ”PHP2”。
開發之後使用PHP的網站漸漸的增加
b.ASP
Active Server Pages
通過ASP我們可以結合HTML網頁、ASP指令和ActiveX元件建立動態、交互且高效的WEB伺服器應用程式。同時，ASP也支持VBScript和JScript等腳本語言，默認為VBScript。其中JScript是微軟公司的ECMAScript標準的實現，並且配合自己的需要做延伸
c.JavaScript
JavaScript是一種腳本語言，與ASP ,PHP不同之處在於他是在用戶端的瀏覽器執行 而非在SEVER端在發往伺服器執行之前不需經過編譯，而是將文本格式的字元代碼發送給伺服器由瀏覽器解釋執行。而且由於每次重新載入都會重新解譯，載入後，有些代碼會延遲至運行時才解譯，甚至會多次解譯，所以速度較慢
參考資料:
http://dyna.hcc.edu.tw/php/class1_1.htm
http://zh.wikipedia.org/w/index.php?title=Active_Server_Pages&variant=zh-tw
http://zh.wikipedia.org/w/index.php?title=JavaScript&variant=zh-tw
2.
九九乘法表
a.PHP
一種嵌入在Html中的語言 最早是 由Rasmus Lerdorf ，他用Perl寫了一些後端的程式，記錄有哪些人看過他的線上履歷表。慢慢地，一些網友對他所寫的程式碼產生興趣。於是，Rasmus Lerdorf就整理這些程式碼，包裝成一個叫作 Personal Home Page Tools基於個人的興趣，Rasmus Lerdorf又寫了一個腳本語言的核心引擎。然後，又加上了能處理HTML表單輸入的工具，稱作 “Form Interpreter”簡稱FI。在1995年完成的這個版本，當時稱作 “PHP FI”，也有人稱之為 ”PHP2”。
開發之後使用PHP的網站漸漸的增加
b.ASP
Active Server Pages
通過ASP我們可以結合HTML網頁、ASP指令和ActiveX元件建立動態、交互且高效的WEB伺服器應用程式。同時，ASP也支持VBScript和JScript等腳本語言，默認為VBScript。其中JScript是微軟公司的ECMAScript標準的實現，並且配合自己的需要做延伸
c.JavaScript
JavaScript是一種腳本語言，與ASP ,PHP不同之處在於他是在用戶端的瀏覽器執行 而非在SEVER端在發往伺服器執行之前不需經過編譯，而是將文本格式的字元代碼發送給伺服器由瀏覽器解釋執行。而且由於每次重新載入都會重新解譯，載入後，有些代碼會延遲至運行時才解譯，甚至會多次解譯，所以速度較慢
參考資料:
http://dyna.hcc.edu.tw/php/class1_1.htm
http://zh.wikipedia.org/w/index.php?title=Active_Server_Pages&variant=zh-tw
http://zh.wikipedia.org/w/index.php?title=JavaScript&variant=zh-tw
2.
九九乘法表
2007年12月10日 星期一
2007年12月9日 星期日
Homework 11-26-2007
1. Problem 1 & Problem 3 of Textbook on Page 55.
(1).解釋 Web 技術演進是要解決什麼樣的問題?
第一時期 web 以靜態的html為主無資料庫的存取
第二時期有了CGI的技術使用程序的觀念作資料的存取
伺服器開始可以將資料先作處理在呈現給user
第三時期服務以執行緒的方式來進行 提高了網頁的效率
從以上的來看 web的技術的演進為的是能夠 與user之間作互動 以及能夠以更高的效率提供服務
(2).程序(Process) 和執行緒(Thread) 對網站性能有什麼不同的影響?
Process 每當服務一位新的user 就要多一個process當user 很多的時候 會降低網站的速度
而Thread 則是以 （serivice/Deamon)的形式常駐 而以執行緒 來提供服務
2. What does a CGI output contain in the HTTP header? Hint: Such as Content-type
使用google 搜尋line coding
網只會變成如下
http://www.google.com.tw/search?hl=zh-TW&q=line+coding&btnG=Google+%E6%90%9C%E5%B0%8B&meta=
?之後 就是要傳遞給伺服器作處理的訊息
zh-TW 表示的是繁體中文
q 表示送出查詢的資料
3. If you want to upload an mp3 file, should you use the GET or POST method? Why?
應該使用POST，因為GET是直接將資訊附加在url上 最多只能到255個字元 有大小的限制
而POST則允許傳送大量的資料
(1).解釋 Web 技術演進是要解決什麼樣的問題?
第一時期 web 以靜態的html為主無資料庫的存取
第二時期有了CGI的技術使用程序的觀念作資料的存取
伺服器開始可以將資料先作處理在呈現給user
第三時期服務以執行緒的方式來進行 提高了網頁的效率
從以上的來看 web的技術的演進為的是能夠 與user之間作互動 以及能夠以更高的效率提供服務
(2).程序(Process) 和執行緒(Thread) 對網站性能有什麼不同的影響?
Process 每當服務一位新的user 就要多一個process當user 很多的時候 會降低網站的速度
而Thread 則是以 （serivice/Deamon)的形式常駐 而以執行緒 來提供服務
2. What does a CGI output contain in the HTTP header? Hint: Such as Content-type
使用google 搜尋line coding
網只會變成如下
http://www.google.com.tw/search?hl=zh-TW&q=line+coding&btnG=Google+%E6%90%9C%E5%B0%8B&meta=
?之後 就是要傳遞給伺服器作處理的訊息
zh-TW 表示的是繁體中文
q 表示送出查詢的資料
3. If you want to upload an mp3 file, should you use the GET or POST method? Why?
應該使用POST，因為GET是直接將資訊附加在url上 最多只能到255個字元 有大小的限制
而POST則允許傳送大量的資料
Homework 12-3-2007
將listing 1 與 listing 2 合併
同樣的將listing 1 與 listing 3 結合 但是listing 3 必須修改過
原本的
同樣的將listing 1 與 listing 3 結合 但是listing 3 必須修改過
原本的
select="count($matches[team[.=$this]/@score < team[.!=$this]/@score])"/>
修正為
select="count($matches[team[.=$this]/@score > team[.!=$this]/@score])"/>
2007年12月3日 星期一
2007年11月27日 星期二
Lab 17: Form and Action, Part II
2007年11月26日 星期一
2007年11月12日 星期一
Lab 14: Accessibility by GreaseMonkey
- Google Search Keys Numbers the results in a Google search page and you can type the corresponding number to follow the link. Updated: 2005-04-26. more
-
Google Access Keys Enables navigation through Google search results.
- AccessBar: displays defined accesskeys in a fixed-position bar along the bottom of the window. Added 2005-04-01 (not a joke). Find how many access keys have been defined at www.ocac.gov.tw www.epa.gov.tw
There are 2 access keys defined at www.epa.gov.tw
There are 4 access keys defined at www.ocac.gov.tw - Continued from 3, use google to find 3 more government sites in Taiwan that enable access keys.
總統府：http://www.president.gov.tw/index_c.html
衛生署：http://www.doh.gov.tw/cht2006/index_populace.aspx
國防部：http://www.mnd.gov.tw/index.aspx
2007年11月5日 星期一
Homework 10-29-2007
1. At Firefox installed with Greasemonkey, install the Simplified-to-Traditional character conversion tool Lab Tongwen.
使用前
使用後
2. Check into the government-sponsored web accessibility website.
presentation materials. What is web accessibility?
web accessibility 指的就是 無障礙的網頁，在資料中提到了很多網頁的建置，多考慮的無障礙的設計時，索需要注意的細節。比方說閃爍的圖片會造成殘障人士，使用上的不便，以快速鍵來作網頁的瀏覽，以及討論提同時提供有無障礙版本以及普通版本的網頁的影響。簡而言之
web accessibility 就是實際的去考量，身心障礙者的需求 以他們的模式去設計出無障礙的網頁。
3. According to Section 2.1 of Textbook, some websites are powered by databases in the back end and some are not. What are the purposes of using databases?
在電子商務系統中網頁大多不在是靜態的，他會多了很多跟使用者互動交換資料的狀況。舉凡會員註冊，或者是交易。倘若資料量大的時候。有資料庫的幫助。可以將這些資訊作完善的處理。
LAB clean language
greasemonkey disable：
greasemonkey enable:
The bad word "fuck" will be replaced by "*".
greasemonkey enable:
The bad word "fuck" will be replaced by "*".
訂閱：
文章 (Atom)
