Quality Management ROI Calculator - Focus on Test Automation
The Rational Quality Management ROI calculator is intended to give you an idea of what return you can garner from implementing our functional testing solutions. Our quality management solutions offer tools to develop a continuous process, powered by automation to govern software delivery.
» Gartner MarketScope: Application Quality Management Solutions, 1Q 08
This Gartner MarketScope provides guidance for enterprises seeking to purchase tools to manage risk and software quality. We focus on tools fit for large-scale enterprise use and that are ready out of the box to manage quality requirements and functional testing.
» Whitepaper: Tips for Writing Good Use Cases
Writing a good use case isnt easy, but, fortunately, our experience can be your guide. The concepts and principles assembled here represent the works of many people at IBM, and they form a foundation of proven best practices.
» Whitepaper: The Role of Integrated Requirements Management in Software Delivery
Learn about the critical role integrated requirements management can play in helping ensure your business goals and IT projects are continuously aligned-whether you are sourcing, integrat-ing, building or maintaining your software. It also looks at ways that integration and automation can help ensure managing projects and the required changes can be executed using manageable processes that satisfy stakeholders and development teams.
»
Quite frequently, you want some type of trigger to cause your
DHTML to kick in. Whether repositioning blocks
or changing style properties, some event usually causes
these changes.
Many different types of event can occur on a Web page, most of
them caused by the user. He or she might click
on a button (click event), might move the mouse over an
element (mouseover event), or move the mouse
off of an element (mouseout event). The user may submit
a form (submit event) or resize the browser
window (resize event). Additionally, some events occur
without direct user intervention -- the page may
finish loading (load event), for example.
Talking about events in this article is tricky because, like
our previous discussions, working with events crosses
a couple of authoring technologies. The Document Object Model
also defines types of events and their characteristics,
such as to which elements they apply. More exactly, though, you
manipulate and control events using
JavaScript
syntax. Once again, then, the handling of events is not exactly
the same between Microsoft and Netscape browsers,
at least until a standardized DOM comes along.
Managing events can be relatively simple or quite complex,
depending on the ambitions of your project. Since
this is an introduction, we'll focus mainly on event basics.
Fortunately, basic events are handled most similarly
between browsers.
Event Handlers
Events occur on a Web page whether you choose to act on them or
not. When the user moves the mouse over an element,
a mouseover event occurs. If you would like to leverage
this event as a trigger for some dynamic action,
you must construct an event handler.
An event handler is created as an attribute for the tag which
defines the element at which you wish to catch
the event. Event handler attribute named follow the syntax
onEventname, and they accept JavaScript statements
as their action. For
example,
the following tag creates a
hyperlink with a mouseover event handler specified.
<A HREF="page.html"
onMouseOver="changeStatus('Read this page');
return true">
Click here
</A>
The onMouseOver event handler catches a mouseover
event. When this event occurs at this element,
a JavaScript function is called named changeStatus().
This is a fictional function, you can imagine that
it might exist to change the message on the browser's status
bar. Any JavaScript statement is allowed in an event
handler, so we could also execute direct statement rather
than call a function. For
example,
suppose that a mouseover
for this element in MSIE should modify a style sheet's color property:
The above example assumes MSIE, since style sheet modifications
aren't supported in Netscape. We also assume
that a style sheet exists in this document! But, hey, it's
just an example.
Once again, a convenient table will help summarize the common
event and their event handler names.
Event
Event Handler Syntax
Description
click
onClick
User clicks (left) mouse button on an element.
submit
onSubmit
User submits a form, this event fires before the
form submission is processed.
reset
onReset
User resets a form.
focus
onFocus
User brings focus to an element either via mouse
click or tabbing.
blur
onBlur
User loses focuses from an element by clicking
away or tabbing away.
mouseover
onMouseOver
User moves mouse over an element.
mouseout
onMouseOut
User moves mouse off of an element.
mousemove
onMouseMove
User moves mouse.
change
onChange
User changes value in a text, textarea, or select field.
select
onSelect
User selects (highlights) a portion of text in a text or textarea field.
resize
onResize
User resizes browser window or frame.
move
onMove
User moves browser window or frame.
load
onLoad
Page completes loading.
unload
onUnload
User exits page (by navigating to a new page or
quitting browser).
error
onError
An error occurs loading an image or document.
abort
onAbort
User stops an image loading using the stop button.
The above table is a quick reference guide. There are some
important caveats to keep in mind. For one, this
is not a comprehensive list of all events, although these
are by far the most commonly used. Both browser support
additional events for detecting keypresses and other mouse
actions, while MSIE supports additional events above
and beyond Netscape's. Secondly, you must keep in mind that
not every event is applicable to every element. This
also varies between browsers. For example, within Netscape
a mouseover event only applies to a hyperlink
<A>, area <AREA> or layer <LAYER>. Yet,
within MSIE, you can apply a mouseover event to
almost any element, including images <IMG>, and
paragraphs <P>.
In general, the above rule holds between browsers: Netscape
restricts each event to certain limited elements,
while MSIE allows most events to be handled at most elements.
The best way to clarify these distinctions is to
read the documentation --
Netscape's Events and Event Handlers and
Microsoft's DHTML Events Reference.
Mastering event handling is most certainly a topic unto itself.
At the surface, handling basic events is simple,
as you've seen. The classic "rollover effect" is a
perfect example of a simple event used in DHTML.
A rollover occurs when the user moves the mouse over an element;
while the mouse hovers over the element, its appearance
changes to reflect that it is "active". When the mouse
moves off the element is reverts to a more subdued
state. Rollovers commonly use changes in either image or style.
Below is a basic MSIE style-based rollover, which
makes the "active" text red and bold, and returns to
normal blue when inactive. Remember that such dynamic
styles don't work so easily under Netscape, although you could
certainly re-imagine this example for Netscape,
perhaps by swapping an image for the rollover effect; or
swapping a layer.
Quality Management ROI Calculator - Focus on Test Automation
