Lab Drag-and-Drop by AJAX

1. Go to Laszlo and enter (Laszlo in 10 minutes).
2. Study and play around the "drag-and-drop" example.
3. Use this method to control movie playing as in the previous lab.
4. If you drag and drop the photo to the "play" area, the movie plays.
5. If you drap and drop the photo to the "pause" area, the movie pauses.

期末報告

1.先利用window和form開啟一個有顏色的視窗在(10,10)的位置
名字是"es1" 顏色的編號是0xAAB5C8


2.利用statictext來把想要出現的文字顯示在視窗上
再用edittext來設計可以輸入的表單


3.使用radiobutton讓user可以隋心所欲的勾選想要放大的倍率
用radiogroup來寫很多個radiobutton就可以不用一直定義座標


4.寫一個button送出資料


5.最後用view來顯示另外一個頁面
他的datapath="echoer:/response"
利用align="center"可以使文字出現在正中央

Lab Movie Player by AJAX

1. Go to Laszlo and enter (Laszlo in 10 minutes).
2. Study and play around the "scripting" and "video" examples.
3. Use this script to control movie playing.

[view id="video" x="0" y="50" resource=""http:jfk.swf"/]

4. If you push the "pause" button, the movie pauses.

[button x="200" onclick="video.setAttribute('play',false) "]pause[/button]

5. If you push the "resume" button, the movie resumes.

[button onclick="video.setAttribute('play',true)"]resume[/button]

Homework 12-10-2007

1. List three ways of creating interactive webpages.

Nvu.CGI.Greasemonkey.JavaScript

2. Lab DOM and Javascript.

Lab DOM and Javascript

3. Reading Assignments: AJAX by Jeremy Keith

Dom Scripting

Lab DOM and JavaScript

9*9 product

Lab Create Img using DOM

1.直接使用 "window.onload = buildTable"



2.利用button onclick來執行圖片

lab 19: XSLT Part II

1. Register and Download Xray, an XML, XSLT editor and processor.

2. Given the
Listing 1. An XML document representing the results of a soccer tournament
Listing 2. A basic style sheet for the soccer results

use the XSLT as in the Listing 2 to transform the XML file as in the Listing 1.

3. View the formatted HTML file.
4. Given the
Listing 1. An XML document representing the results of a soccer tournament
Listing 3. A style sheet that computes team standings

compute the team standings in a table.

5. View the formatted HTML file.

lab 20: XSLT Part III

1. Given the RSS of Yam News, write an XSLT file
and use Xray to generate an HTML that contains the titles of items in the RSS.

2. View the formatted HTML file.

lab 18: Lab XML & XSLT

Homework 11-26-2007

1. Problem 1 & Problem 3 of Textbook on Page 55.

Problem1. 試解釋WEB技術演進是要解決什麼樣的問題?

Web最早的概念是不常更新,甚至不更新的靜態HTML頁面。
而現在的使用者所需求的是一個動態的Web，可以從不斷變化的內容資料庫中即時生成動態HTML頁面。Web 是透過參與者的互動：不論是提供內容、為內容索引或評分，都能夠使他們所使用的平臺增值。

Problem3. 程序(PROCESS)與執行緒(THREAD)對網站性能有什麼不同的影響?

程序（Process）
用在Web系統演進的第二時期，當使用者增多時，由於耗費過多系統資源會導致網站速度明顯下降。

執行緒（Thread）
用在Web系統演進的第三時期，取代了程序，而使用常駐的服務（Service\Daemon），此程式會一直留在系統內，除非關機，否則會一直做服務。當人多時Thread就會變多;人少時，Thread就會減少，故不會耗費系統資源而導致網站速度下降。

2. What does a CGI output contain in the HTTP header? Hint: Such as Content-type

留言板 E-mail意見回覆 計數器...等等

3. If you want to upload an mp3 file, should you use the GET or POST method? Why?

POST method

*POST method 是將資料包裝在 HTTP 標頭內傳送給 Web server。
GET method 是將資料直接加在 URI 之後。

4. Reading Assignments:XML (Page 187-188 on the Textbook)

Lab 17: Form and Action, Part II

Hand code a HTML or use Nvu to edit an HTML so that the webpage can send a request to Google like
http://maps.google.com/maps?q=24.9586,+121.24114

Lab 16: Form and Action

"logic will get you from A to B - imagination will take you anywhere"

How to use Form to invoke a remote service through CGI.

1. Copy the search box of this search page,
inlcuding radio buttons, text input, and submit button.



2. Open your Nvu HTML editor.



3. Open a new empty HTML file.



4. Paste the search box into this new file.





5. Use Nvu to add a Form to this search box. Do not hand code the HTML. Just fill the blank in the Form dialog.

6. In the form dialog, set Action="http://google.com/search" and name of Form as "f" and method as "get"
(See Hint if it does not work.)




輸入"123"搜尋

\

7. Run your HTML by Firefox. What do you get?



8. Set method as "post"



9. Run your HTML by Firefox. What do you get?

Homework 10-1-2007

根據無障礙網頁設計原則

1. 為什麼不要開出新視窗?

這個新視窗不會保有前一個視窗的瀏覽歷程，所以「上一頁」按鈕將會失去功效。

解決方案:
一.如果妳一定得要把某個連結開到新視窗，請務必明確地警告讀者。這祇是個不理想的權變方案，通常是隨著某些「不得與外部內容相關聯」的商業政策而來的。舉例來說，CNN 的「相關站台」頁面就是這樣。
二.不要用 < a target="_blank" >來強迫連結開出新視窗。
三.如果妳看到「在新視窗開啟鏈結」的核選框，請確定它按照預設值而處於關閉的狀態。

2. 為什麼要使用貼切的網頁標頭? 而不是留白?

一.Google 會在搜尋的結果裡顯示網頁標題
二.如果開啟的是網頁就會唸出網頁標題。例如:Home Page Reader
三.視窗標題列的網頁標題就像是個視覺上的錨點，即使是他捲動頁面時仍會留在同一地方；所以如果忘記內容可以回頭看一下標題來喚起記憶。

3. 定義快速鍵有什麼好處?

definition of accesskey: The accesskey attribute, aimed at making web pages more accessible.

you can without a mouse, and in a convenient way.They might be useful, if a site-wide system of access keys makes a site more easily navigable. If you use them, the assignments should be described separately, not in title attributes or relying on underlining or other small hints. And I would recommend using just digits for access keys, with digit 0 acting as access key to a document that describes the other assignments.

Lab 15 Webpage Accessibility

Use Nvu to edit the following homepage
at http://www.epa.gov.tw

1. You can copy and paste the content to your Nvu



2. Take a look at the HTML 標籤, HTML 原始碼

HTML 標籤


HTML 原始碼


3. Save your editings and preview your webpage using Firefox

Lab 14: Accessibility by GreaseMonkey

3.1.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



2.Google Access Keys Enables navigation through Google search results.



3.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

http://www.ocac.gov.tw/



http://www.ocac.gov.tw/




Continued from 3, use google to find 3 more government sites in Taiwan that enable access keys.

立法院全球資訊網http://www.ly.gov.tw/



行政院衛生署http://www.doh.gov.tw/cht2006/index_populace.aspx



中華民國總統府網站http://www.president.gov.tw/

Lab 13: Clean Language

1. Save the JavaScript file of Clean Language to your desktop. Make changes to the script with self-defined bad words. To do this, save the JavaScript on your desk top. Use Notepad editor to make changes. Install the modified script as Greasemonkey.


用WordPad 開啟 JavaScript Source code，並且可以修改程式



安裝步驟:





fuck會變成***