• Create BookmarkCreate Bookmark
  • Create Note or TagCreate Note or Tag
  • PrintPrint
Share this Page URL
Help

Lesson 8. Using Libraries > Creating a Library Item Containing Behaviors

Creating a Library Item Containing Behaviors

Since library items must be contained within the <BODY> of the document and cannot contain or reference any items outside the <BODY>, JavaScript cannot be used in library items if the script requires code between the <HEAD> and </HEAD> tags of the document because those tags are located before the <BODY> tag. There is one exception however. Because behaviors are predefined JavaScripts for which Dreamweaver will insert the corresponding JavaScript functions into the <HEAD>, you can use Dreamweaver's behaviors in library items, even though the necessary JavaScript requires code to be placed between the <HEAD> and </HEAD> tags of the document. Although the code required in the <HEAD> is not included in the library item, Dreamweaver will automatically place the code into the <HEAD> whenever the library item is placed into a document.

1.
Open technology.html and click the history navigation graphic near the top of the page, beneath the main “Lights of the Coast” title. Use the Tag Selector at the bottom of the document window to select the table by clicking the <table> tag that is closest to the history image.

This will be the rightmost <table> tag beneath the copyright line. This table contains rollovers that were created for each image. Rollovers and other behaviors were covered in Lesson 5.

2.
Click the new library item icon at the bottom of the Library category of the Assets panel. Type navigation for the new library item, and then press Return (Macintosh) or Enter (Windows).

The library item contains certain portions of the code necessary for the behavior, including the event, as well as the action to call when the event occurs. It does not contain any of the JavaScript functions that are required to be placed between the <HEAD> and </HEAD> tags of the document. You worked with events and actions in Lesson 5.

3.
Insert this new library item at the top of the page in the culture.html document by clicking in the black bar below the Lights of the Coast title graphic, selecting the navigation library item and clicking Insert on the Library category of the Assets panel.

The JavaScript functions that are required for the rollover in this library item are automatically inserted between the <HEAD> and </HEAD> tags of the document. While these functions are not included in the library item, they are inserted because Dreamweaver recognizes certain portions of the code in the library item as behaviors and automatically inserts the required code into the <HEAD>. You will learn about working with the code in Lesson 12.


PREVIEW

                                                                          

Not a subscriber?

Start A Free Trial


  
  • Creative Edge
  • Create BookmarkCreate Bookmark
  • Create Note or TagCreate Note or Tag
  • PrintPrint