| |
||||
|
|
|
|||
|
 
|
|
|
||||||||
| Lesson 1 | Lesson 2 | Lesson 3 | Lesson 4 |
| Lesson 5 | Lesson 6 | Lesson 7 | Lesson 8 |
You can order copies of the following books:
Web Production for Writers and Journalists in paperback.
The Internet: The Basics in paperback.
The Cyberspace Handbook in paperback.
To
complete our site, we will add the final Secret Cornwall page which makes
use of certain dynamic HTML effects to create an interactive site. Dynamic
effects, like JavaScript, are attached to events that can be triggered
by mouse movements. As the events in this example are produced by the
cursor moving over parts of an image, the image must first be sliced so
that different sections can cause different effects. If you have a program
such as ImageReady or Fireworks to hand, download the image penwith.jpg
and open it in one of these applications: using mask tools, each program
can create guidelines for slicing the image as well as generating the
HTML code to incorporate the image within a web page. Alternatively, download
the different pewith_r_*.jpg files and the file penwith_table.htm and
cut and paste it into a template file named map.html.
The
spliced image should be positioned in the centre of the page, with the
file penwith_title.gif and links to each of the top level pages beneath
it. The images contained in the table contain four yellow circles and
four red stars corresponding to different places that display hidden text
on the page. Using the Floating Box tool, draw four boxes on each side
of the map, copying the files penwith1-8.txt into each box. Once text
is entered, select each layer from the Floating Box Controller (View,
Floating Box Controller or Alt+5) and, in the Controller, click the checkmark
next to visible off so that they are hidden. To see the layers while you
are working on them, click on the greyed out eye next to each one so that
it appears with a red dot in the centre. It is generally easier to work
with multiple layers if they are given distinctive names, and you can
change the name for each layer in the properties palette.
After
making each layer invisible, select the star or circle that corresponds
to each one. First, click on the Link tab and then click on the Link button
beneath URL to place an empty anchor tag around the image. Next, click
on Actions and, under Events select the trigger 'Mouse Enter'. Beside
this box is a plus sign next to the word Actions; click this to highlight
the button Action, which will display a menu when clicked. Select Multimedia,
ShowHide, then in the boxes beneath this choose the appropriate layer
and, for Mode, select Show. Do the same for 'Mouse Exit', but with Hide
as the mode selection.