1. Project 9
Media Objects

2. Project Objectives Describe media objects
Insert Flash text into a Web page
Insert a Flash movie into a Web page
Add a background sound to a Web page
Project 9: Media Objects

3. Project Objectives Embed a sound file in a Web page
Insert a video into a Web page
Check for plug-ins
Describe Shockwave and how to insert a Shockwave movie into a Web page
Project 9: Media Objects

4. Project Objectives
Describe a Java applet and how to insert an applet into a Web page
Describe the ActiveX control and how it differs from plug-ins
Use the Results panel to validate a Web page, check links, and check target browsers
Project 9: Media Objects

5. Copying Data Files to the Colorado Parks Web Site
Click the Start button on the Windows taskbar and then click My Computer
Double-click Local Disk (C:) and then navigate to the location of the data files for Project 9
Double-click the DataFiles folder, double-click the Proj09 folder, and then double-click the parks folder
Right-click the media folder to display the context menu and then copy the media folder to the your name\parks folder using the Copy and Paste commands on the context menu
Project 9: Media Objects

6. Copying Data Files to the Colorado Parks Web Site
Click the Back button and navigate to the DataFiles folder. Double-click the DataFiles folder, double-click the Proj09 folder, and then double-click the parks folder. Use the context menu to copy the splash.htm file
Navigate to the your name/parks folder and use the context menu to paste the splash.htm file into the folder
Close the My Computer window
Project 9: Media Objects

7. Starting Dreamweaver and Opening the Colorado Parks Web Site
Click the Start button on the Windows taskbar
Point to All Programs on the Start menu, point to Macromedia on the All Programs submenu, and then click Macromedia Dreamweaver 8 on the Macromedia submenu
If necessary, display the panel groups, and close the Property inspector
Project 9: Media Objects

8. Starting Dreamweaver and Opening the Colorado Parks Web Site
Click the Files panel box arrow on the Files pop-up menu and then click Colorado Parks
Open the splash.htm page
If necessary, press CTRL+F2 to display the Insert bar and then select the Common category
Project 9: Media Objects

9. Starting Dreamweaver and Opening the Colorado Parks Web Site
Project 9: Media Objects

10. Adding Flash Text
Collapse the panel groups. Click the first cell in table01
Click the Media pop-up button on the Insert bar and then point to Flash Text
Click Flash Text
Click the Font box arrow, scroll down, and then click Comic Sans MS in the Font list. If the Comic Sans MS font is not available on your computer, select another font of your own choosing or as directed by your instructor
If necessary, double-click the Size text box and type 30
Project 9: Media Objects

11. Adding Flash Text
Double-click the Color hexadecimal text box, type #000000, if necessary, and then press the TAB key
In the Rollover color hexadecimal text box, type #F8E4BF and then press the TAB key. Type A world of adventure – Colorado National Parks in the Text box
Click the Bg color hexadecimal text box. Type # and then press the TAB key
Type media/heading01 in the Save as text box
Click the OK button
Project 9: Media Objects

12. Adding Flash Text
Click the second cell in table01 and then click the Flash Text command on the Media pop-up menu
Add the following attributes to the Insert Flash Text dialog box: Font: Comic Sans MS; Size: 20; Color: #000000; Rollover color: #F8E4BF; Text: Visit a Colorado park for a vacation of a lifetime!; Bg color: #993333; and Save as: media/heading02
Click the OK button. Press CTRL+S to save the Web page. Display the Property inspector
Press F12 to view the page in the browser. Move the mouse pointer over each line of text to verify that the text changes color.
Close the browser
Project 9: Media Objects

13. Adding Flash Text
Project 9: Media Objects

14. Adding a Flash Movie
If necessary, scroll down and then click the movie layer
Display the panel groups and then click the Assets tab. Click the Flash icon in the Assets panel and then drag globe.swf to the movie layer
Hide the panel groups
Project 9: Media Objects

15. Adding a Flash Movie
Click the Flash text box in the Property inspector and then type globe as the movie name
Click the Play button in the Property inspector
Click the Stop button in the Property inspector
Project 9: Media Objects

16. Adding a Flash Movie
Project 9: Media Objects

17. Adding a Link to Go to the Index Page
Scroll up in the Document window and then click table02
Type Skip Intro and then select the text. Click the BOLD button. Click the hexidecimal text box and type # Press the TAB key
Display the panel groups and then click the Files tab. If necessary, scroll down in the Files panel and then drag index.htm to the Link box in the Property inspector. Press the ENTER key and then click anywhere on the page
Project 9: Media Objects

18. Adding a Link to Go to the Index Page
Click the Save button on the Standard toolbar and then press the F12 key to view the page in your browser
Click the link to verify that it works
Close the browser and return to Dreamweaver
Project 9: Media Objects

19. Adding a Link to Go to the Index Page
Project 9: Media Objects

20. Adding a Background Sound and Setting Parameters
Hide the Property inspector. Click below the movie layer
Click the Media pop-up button and then point to Plugin on the Media pop-up menu
Click Plugin
If necessary, navigate to and select the media folder and then click colorado in the list of files
Project 9: Media Objects

21. Adding a Background Sound and Setting Parameters
Click the OK button
Verify that the placeholder is selected. Display the Property inspector and then type 2 in the W text box
Press the TAB key and then type 2 in the H text box. Press the ENTER key
Click the Parameters button
Project 9: Media Objects

22. Adding a Background Sound and Setting Parameters
Type hidden in the Parameter column. Press the TAB key two times
Type true in the Value column and then press the TAB key two times
Type autoplay and then press the TAB key two times. Type true in the Value column
Press the TAB key two times. Type loop in the Parameter column, press the TAB key two times, and then type false in the Value column
Project 9: Media Objects

23. Adding a Background Sound and Setting Parameters
Click the OK button
Save the file
Press the F12 key to open the browser and verify that the audio works. A speaker or headphones must be attached to the computer for you to hear the audio. Close the browser
Close the splash.htm page
Project 9: Media Objects

24. Adding a Background Sound and Setting Parameters
Project 9: Media Objects

25. Embedding an Audio File
Open the natl_parks.htm page and then hide the panel groups
Click to the right of the heading text, Colorado National Parks, and then press the ENTER key
Click the Media pop-up button and then point to ActiveX
Click ActiveX
Click the ActiveX name box in the Property inspector and then name the ActiveX control birdsound
Project 9: Media Objects

26. Embedding an Audio File
Change the W value to 200 and the H value to 45. Type CLSID:22d6f312-b0f6-11d0-94ab-0080c74c7e95 in the ClassID text box
Press the ENTER key
Click the Embed check box and then click the Browse for File icon to the right of the Src text box
If necessary, when Dreamweaver displays the Select Netscape Plug-In File dialog box, click the Look in box arrow and then, if necessary, navigate to the media folder
Click the Files of type box arrow and then click All Files. Click the birdsound file. Verify that Document is selected in the Relative to box
Project 9: Media Objects

27. Embedding an Audio File
Click the OK button
Click the Parameters button in the Property inspector
If necessary, click the Plus (+) button to display the insertion point in the Parameter column
Type FileName and then press the TAB key two times. Type media/birdsound.au in the Value column
Press the TAB key two times
Project 9: Media Objects

28. Embedding an Audio File
Use Table 9-4 on page DW 729 to add the other parameters and values to the Parameters dialog box
Click the OK button
Click the Save button on the Standard toolbar
Press the F12 key to view the Web page in your browser. Click the Play button to listen to the audio. A speaker or headphones are necessary to hear the sound. If a Dreamweaver dialog box is displayed, read the information and then click the OK button
Close the browser
Project 9: Media Objects

29. Embedding an Audio File
Project 9: Media Objects

30. Adding Video to a Web Page
If necessary, collapse the panel groups. Scroll to the bottom of the page and then click to the right of the Home link
Click the ActiveX button on the Common category Insert bar
Click the ActiveX name box in the Property inspector and then type gps as the name
Press the TAB key and then change the W value to 320. Press the TAB key and then change the H value to 240
Click the ClassID box arrow and then select the ClassID value you entered earlier in this project
Project 9: Media Objects

31. Adding Video to a Web Page
Click the Align box arrow and align the ActiveX control to the right
Click the Embed check box in the Property inspector
Click the Browse for File icon to the right of the Src text box
If necessary, navigate to the media folder, click the Files of type box arrow, and then select All Files. Click the Tracking kids with GPS file
Click the OK button
Project 9: Media Objects

32. Adding Video to a Web Page
Click the Parameters button in the Property inspector and then click the Plus (+) button
Apply the steps you used previously to add the parameters and values shown in Table 9-6 on page DW 734 to the Parameters dialog box
Click the OK button. Save the page. Press the F12 key to display the page in your browser. Scroll down to display the video file. Click the Play button.
Close the browser to return to Dreamweaver. Close the natl_parks page.
Project 9: Media Objects

33. Adding Video to a Web Page
Project 9: Media Objects

34. Verifying Internal Links with the Link Checker
Display the panel group and then open the index.htm page
Click slideshow.htm in the Files list to select the name and then press the F2 key
Type slide_show.htm to rename the file and then press the ENTER key
If the Update Files dialog box is displayed, click the Don’t Update button
Project 9: Media Objects

35. Verifying Internal Links with the Link Checker
Press the F5 key to refresh the panel groups and then hide the panel groups
Click File on the menu bar, point to Check Page, and then point to Check Links
Click Check Links
Double-click index.htm in the Results panel
Project 9: Media Objects

36. Verifying Internal Links with the Link Checker
Double-click the Link box in the Property inspector and type slide_show.htm as the new link. Press the ENTER key
Click the Check Links arrow and then click Check Links in Current Document
Save the index file
Project 9: Media Objects

37. Verifying Internal Links with the Link Checker
Project 9: Media Objects

38. Closing the Web Site and Quitting Dreamweaver
Click the Close button on the upper-right corner of the Dreamweaver title bar
Project 9: Media Objects

39. Project Summary Describe media objects
Insert Flash text into a Web page
Insert a Flash movie into a Web page
Add a background sound to a Web page
Project 9: Media Objects

40. Project Summary Embed a sound file in a Web page
Insert a video into a Web page
Check for plug-ins
Describe Shockwave and how to insert a Shockwave movie into a Web page
Project 9: Media Objects

41. Project Summary
Describe a Java applet and how to insert an applet into a Web page
Describe the ActiveX control and how it differs from plug-ins
Use the Results panel to validate a Web page, check links, and check target browsers
Project 9: Media Objects

42. Project 9 Complete
Media Objects