Thursday, December 11, 2008

exercises 2

1. Modify the IQTravel_3a.html document by adding a hyperlink near the end of the document. Place the following sentence: "Find out more about one of our favorite islands." in the document where the darker type is the clickable portion. Locate a "home page" for some island of your choice on the internet and make that the target of the hyperlink.
exercise 1
3. If you have access to a printer, print out the document from the previous exercise. Print the original version of the same document and compare.
New version: Find out more about one of our

favorite islands
, or visit the

Web-Archipelago site
, just one of the places where you
can gain more information about other island adventures.
Old version: Visit the
Web-Archipelago site
, one of the places where you
can gain more information about other island adventures.

5. Locate a site containing small icons (you can start from the Web-Archipelago site) and find an appropriate arrow icon that you can use to take you back to the top of the page as in the previous exercise. Turn the icon into an explicitly-anchored hyperlink to take you to the top of the page in the IQTravel_3b.html Web document. Try the use of the BORDER attribute to see the effect.
exercise 5--with bordersexercise 5--without borders
7. Modify the townMap.html document to provide for a default region in which mouse clicks will result in a link to a document (just create a simple test one) whose name is neighborhoods.html.
exercise 7
Some browsers may not support the default region in client-side image maps.
Longer Voyage Exercises
9. Start with the townMap.html document and use the coordinates of the clickable regions associated with Brent's Restaurant and the Cowboy Museum in the following way. Suppose the street from the corner on which Brent's Restaurant is located to the corner on which the Cowboy Museum is located is known as Stevens Creek Plaza. In the client-side image map implementation create a narrow rectangular area that contains this street. When the user clicks in this region, link to a test document called plaza.html. Make sure your implementation works correctly. In particular, let clicks in the restaurant and museum have precedence over the plaza.
exercise 9
11. In the previous exercise, use small icons to identify each list item and make the icon the active element to click.Exercise #2:In this exercise you will develop an HTML notebook where you can keep track of useful Web sites containing material that you can use for your HTML documents.
(a) Create a table of contents at the beginning of the document (use an ordered list):1. HTML language elements2. Images and textures3. Graphical elements4. Useful techniques
[Language elements should be about tag syntax and other things that will help you quickly locate material you need for Web development. Images and textures are either sites where you can get image elements that you can use as background images or links to images themselves that you may have downloaded and placed in a graphics directory. Graphical elements are sites containing collections of things like small icons or perhaps icons themselves that you have downloaded and placed in an icon directory. Useful techniques should be links to sites that contain information about things like forms or interesting techniques for doing interesting things that you might want to use someday.]
(b) Make these topics hyperlinks to explicit anchors within the notebook document.
(c) In each of the sections provide a list of items containing links to locations relating to that topic. Provide a few lines that will tell you what's at the other end of the hyperlink.
HTML notebookNote: to check if the explicit anchors work, make your browser window small
13. Download the image: stonehenge.gif from the textBook graphics area of the Web-Archipelago. The following figure identifies certain key points in terms of their pixel coordinates relative to the upper left corner of the image.1: (198, 133) 2: (201, 180) 3: (214, 183) 4: (216, 133) 5: (132, 37) 6: (138, 65)7: (230, 68) 8: (274, 58) 9: (374, 54) 10: (374, 26) 11: (211, 22)
We'll create a clickable image such as one might use in a computer game. We want to let the region marked by the four points 1 - 4 be a portal into another realm of the game. The dark horizontal stone resting atop the others and marked by the points 5 - 11 is a lethal area. Users who click here will perish. Clicking anywhere else in the image will leave users in a lost state.
First set up a directory called mystery in which you will place four HTML documents:(a) an HTML document that will contain the stonehenge picture. Above picture place the following text as a level 1 header (centered):
Mystery jumpBelow the picture, center the following text:
Click in the picture and hyperlink into the mystery.Beware of the hidden danger!
(b) an HTML document (perish.html) that is completely black except for white text (centered---level 1 header)
You have perished
(c) an HTML document (realm.html) that is completely white with red text (centered---level 1 header)
Enter into the realm
(d) an HTML document (lost.html) that is gray with black text (centered---level 1 header)
You are lost
Create a client-side clickable image from this image and create links so that users who click in the portal area go to the realm document. Those who click on the dangerous stone go to the perish document and all other clicks go to the lost document.

No comments:


My Blog List