|
|
Translation
|
Top Authors
|
Articles Published: 20 |
|
|
Articles Published: 20 |
|
|
Articles Published: 13 |
|
|
Articles Published: 10 |
|
|
Articles Published: 10 |
|
|
Articles Published: 9 |
|
|
Articles Published: 7 |
|
|
Articles Published: 6 |
|
|
Articles Published: 6 |
|
|
Articles Published: 6 |
Resources
PageRank Checker
Multi-Rank Checker
Backlink Checker
Keyword Density
Keyword Suggestion
Link Popularity
Index Checker
Broken Link Checker
Link Price Calculator
Reciprocal Link Checker
Site Speed Test
Download Center
Top List
Banner Exchange
Add Your Link
Link ShortenerSocial Bookmarking
Using Dreamweaver To Add Javascript To Your Web Pages
JavaScript is a simple, client-side scripting language which enables you to add exciting and interesting functionality to your HTML pages. It is built in to most web browsers and, although it can be deactivated, most people will have it enabled within their browser.
JavaScript's uses includes the validation of entries within an HTML form and the detection of browser versions and presence or absence of plug-ins. Dreamweaver's implementation of JavaScript centres on the use of what it calls "behaviors".
A behavior is simply a pre-written JavaScript function which can be triggered by a given event. To make the Behaviors window visible, choose Behaviors from the Window menu. Next select the element to which you want to attach the JavaScript. Finally, choose one of the available behaviors from the menu in Behaviors window. (The behaviors which are available will depend on the item you have highlighted.)
Whenever you attach a behavior to a web page element, Dreamweaver attempts to guess what the event which should trigger the JavaScript (mouse click, rollover, etc.). If Dreamweaver fails to assign the event that you actually want, simply choose a different event from the drop-down menu next to the event name.
Dreamweaver contains several types of JavaScript behaviors. Some relate to images, others display windows and messages, others can be used on forms and form fields and still others can be used to manipulate CSS attributes. To get a flavour of how behaviors work, let us examine a behavior in each of the above categories.
There was a time when almost every website featured the rollover effect on its navigation buttons. With the development of CSS, this is no longer the case. However, the facility of having an image change appearance when the mouse passes over it is still useful. Dreamweaver achieves this effect with the "Swap Image" behavior which can either be added to an image or can be created automatically by inserting a rollover image (Insert > Image Objects > Rollover Image) rather than a static one.
Dreamweaver's "Open Browser Window" behavior allows you to create the controversial JavaScript pop-ups. Due to its extensive misuse, many people have developed an extreme intolerance of this feature. However, there are situations where it is useful. For example, if a user is in the middle of filling out a form and clicks a help icon next to a certain item, a pop-up window is an ideal method of displaying the help topic.
The most important and useful form-handling behavior is "Validate Form". This can be triggered either on submission of the form ("onSubmit") or when a given text field loses focus ("onBlur"). When you assign the behavior, you choose the type of validation you wish to perform: ensuring that the field has not been left blank, contains a valid email address, contains a number or contains a number between two specific values.
Dreamweaver has a number of behaviors which can be applied manipulate the CSS attributes associated with a given page element. One such behavior is Show/Hide Elements. This enables you to make the content of an HTML element visible or hidden based on an action performed by the user. You can apply this behavior to the content of an H1, DIV, P(aragraph) basically, any element that can contain stuff.
Naturally, there is some overhead involved in using Dreamweaver's behavior in terms of the code generated within your web page. To make your pages accessible and search engine friendly, it is recommended that you transfer JavaScript code into an external .js file and then link each of your web pages to the external JavaScript file. In Dreamweaver's code view, highlight all of the JavaScript code between the opening and closing SCRIPT tags, then choose Cut from the Edit menu. Create an empty text file, paste in all the code and save the file with a .js file extension. Finally, in the opening SCRIPT tag on your web page type src="myscript.js", replacing "myscript" with the name of your file.
Article Source: OrganizingWeb.net
About the Author
Author is a developer and trainer with Macresource Computer Solutions, an independent computer training company offering Adobe Dreamweaver Classes at their central London training centre.
More recent articles in Business Online Category
- 11 Content Ideas to Put on Your Website
- The most common Web Design Mistakes
- Hire PHP Programmer Outsourcing is the key to success
- Tips for starting a web hosting reseller business
- Affordable Website Design 1 - What You Need
- ASP vs. PHP: A Quick Comparison
- Business Web Site Design Tips - A Word to the Wise on Marketing
- For Growth You Must Perform Website Maintenance
- The Importance of Professional Web Design
- 5 Vital Rules For Web Site Design
Most Popular Articles
- Want to Know How To Be a Great TV Guest?- Using Dreamweaver To Add Javascript To Your Web Pages
- Affordable Website Design 1 - What You Need
- Improve Gas Mileage With These Tips And A HHO Gas Generator Plans
- The most common Web Design Mistakes
- Website Design and Development: Get to the Virtual World
- Early Warning Signs of Debt Problem
- Texas Web Designers unlock SEO Web Design
- Cell Phone History
- Article Marketing Tips