1 / 29

Macromedia Dreamweaver 4

Macromedia Dreamweaver 4. Advanced Level Course. 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 . Animated Rollovers.

kamilia
Télécharger la présentation

Macromedia Dreamweaver 4

An Image/Link below is provided (as is) to download presentation Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author. Content is provided to you AS IS for your information and personal use only. Download presentation by click this link. While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server. During download, if you can't get a presentation, the file might be deleted by the publisher.

E N D

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 A Cascading Style Sheet is a set of formatting rules that can be applied to all pages in the Web site. • Text • Paragraphs • Lists • Positioning • Background • Borders • Rollovers • HTML tags.

  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 <head> section, and links to the selected HTML tag in the <body> of the page.

  20. Attach a Behavior • Window > Behaviors (main menu) • Shift + F3 key combination • 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

More Related