Presentation is loading. Please wait.

Presentation is loading. Please wait.

Macromedia Dreamweaver 4 Advanced Level Course. Add Rollovers Rollovers or mouseovers are possibly the most popular effects used in designing Web pages.

Similar presentations

Presentation on theme: "Macromedia Dreamweaver 4 Advanced Level Course. Add Rollovers Rollovers or mouseovers are possibly the most popular effects used in designing Web pages."— Presentation transcript:

1 Macromedia Dreamweaver 4 Advanced Level Course

2 Add Rollovers Rollovers or mouseovers are possibly the most popular effects used in designing Web pages When the user’s cursor passes over an image, and the image changes, it is called a rollover.

3 Animated Rollovers Animated rollovers have been created in Flash, and are referred to as Flash Buttons. There are 44 different templates available in Dreamweaver.

4 Inserting a Navigation Bar A navigation bar consists of several buttons that represent each page in the Web site. Navigation elements can be text or rollover images.

5 Form Objects Forms are used to communicate information. Information is entered into labelled text fields, and with check boxes and radio buttons. The information the form generates is activated by a CGI script

6 Create a Form A red dashed box will be displayed in the document window. The form outline will expand as elements are added to the form. All form elements are inserted within the outline.

7 Lists and Menus A menu consists of a single-line text field, which has a drop-down menu. A drop-down (or pop-up) menu allows the user to select a single option in the list. A scrolling list consists of a control-sized text box, with a scroll bar at the side.

8 A Jump Menu A Jump Menu has only one menu (or link) item is visible on the page. The remaining items are available in a drop- down list. A Jump Menu is an alternative to a navigation bar.

9 Hidden Fields Hidden fields enable the form to send data that is unseen by the user. This data could be information such as variable data, a form name or version, a page URL, or an e-mail address.

10 File Fields A file field enables the user to upload a file from their hard drive, and send it with the form data upon submission. This field enables data sharing, and features a “browse” button for locating the file to be uploaded.

11 Submit and Reset Buttons The Submit button, when pressed by the user, sends the form data to the server. Submit sends the form information based on the method and action.

12 Create a Cascading Style Sheet Text Paragraphs Lists Positioning Background Borders Rollovers HTML tags. A Cascading Style Sheet is a set of formatting rules that can be applied to all pages in the Web site.

13 Apply and Link CSS Styles Apply CSS Styles automatically with Auto Apply Link to an external CSS Style Sheet with the the click of a button.

14 Modify CSS Styles Modify a style sheet using the Edit Style Sheet function. Link to an external style sheet using the Link External Style Sheet function.

15 Attributes and Options Type – controls the text attributes. Background – controls background. Block – controls the block of text. Box – controls the spacing of images or elements on the page. Border – controls the border around images or blocks of text. List – controls the bulleted style. Positioning – controls the placement of elements on the page.

16 Add Layers Layers enable absolute positioning of objects and elements on a page without having to use tables.

17 Create Layers Creating layers visually is made easy with the use of the Draw Layer function. Layer objects placed numerically, using the Property Inspector, have x, y, and z coordinates : x=left y=top, z=depth (stacking order).

18 Modify Layers The Property Inspector simplifies editing and modification of layers.

19 Behaviors, Events, and Actions A behavior is the combination of an event and an action, which consists of prewritten JavaScript code. When a behavior is attached to an element, Dreamweaver writes the JavaScript code into the section, and links to the selected HTML tag in the of the page.

20 Attach a Behavior 1.Window > Behaviors (main menu) 2.Shift + F3 key combination 3.Show Behaviors in the Launcher Attach a behavior by using one of the following three methods to access the Behaviors Panel:

21 Animation and Timelines Animations need a timeline to make them move.

22 Create a Timeline Animation Timelines are made up of a series of still frames, which are displayed on the screen at 15 frames per second (fps). Keyframe are frames containing the change to the movement of the object.

23 Behaviors and Timelines Add a behavior to a timeline to: to stop and play the animation enable user to control interactivity link to other frames

24 Add Plug-Ins A plug-in enables the specific multimedia content of Web page to be viewed.

25 Add Movies Director is a fully interactive multimedia program, incorporating digital audio and video. Flash uses vector graphics to create animations, special effects, and site navigation

26 Previewing the Site Pages Preview the site pages in all browsers Add hard drive resident browsers to the Browser List

27 Remote Site Set up the Remote Site connection Information is generally supplied by the host server

28 Transferring Files to the Server Connect to the Remote Site Transfer files

29 Synchronizing Files Compares Local and Remote files Displays a list of files that are mismatched Saves a record of changes

Download ppt "Macromedia Dreamweaver 4 Advanced Level Course. Add Rollovers Rollovers or mouseovers are possibly the most popular effects used in designing Web pages."

Similar presentations

Ads by Google