<?xml version="1.0"?>
<!DOCTYPE testsuite SYSTEM "http://www.w3.org/WAI/UA/TS/dtd/uaag-testsuite-2.dtd">


<testsuite id="ts0102-onmouse">
	
	<metaInfo>
		<testTitle>ONMOUSEOVER and ONMOUSEOUT</testTitle>
		<shortTitle>ONMOUSEOVER and ONMOUSEOUT events</shortTitle>				
		<testElement>
			<elementName>ONMOUSEOVER</elementName>
			<hlink href="http://www.w3.org/TR/html401/interact/scripts.html#h-18.2.3">&hspec; ONMOUSEOVER</hlink>
		</testElement>
		<testElement>
			<elementName>ONMOUSEOUT</elementName>
			<hlink href="http://www.w3.org/TR/html401/interact/scripts.html#h-18.2.3">&hspec; ONMOUSEOUT</hlink>
		</testElement>		
		<creator>Dominique Kilman</creator>
		<creator>Colin Koteles</creator>		
		
				
		<metaElement></metaElement>
		<testStyle></testStyle>
	</metaInfo>
	
	<requirementInfo>
   	<checkpoints>
      	<checkpoint xref="tech-device-independent-handlers">
         	<provisions>
            	<provision xref="tech-device-independent-handlers-2"/>
            </provisions>
         </checkpoint>
      </checkpoints>
 	</requirementInfo>			
	
	<content>
		
		
		
		<test section="1">
			<procedure>
				<list>
					<item>Using the keyboard or an assistive technology that emulates the keyboard, navigate to the image link and activate the ONMOUSEOVER event.</item>
					<item>Using the keyboard or an assistive technology that emulates the keyboard, navigate off the image link and activate the ONMOUSEOUT event.</item>					
				</list>
			</procedure>
			<testCode>
				<p><a href="../action/return.html">
					<img id="lamp1" onmouseover="imgChange1('../images/tn_desklamp1.gif')" onmouseout="imgChange1('../images/desklamp2.gif')" src="../images/desklamp2.gif" height="32" width="25" alt="Lamp turned off" border="0" name="lamp1"/>
				</a></p>			
			</testCode>
      	<exResults>
				<list>
					<item>Image swaps with keyboard command</item>
				</list>
			</exResults>
			<sourcescript>
					function imgChange1( img ) 
					{
   					document.lamp1.src = img;
					}	
			</sourcescript>
		</test>
		
		<test section="2">
			<procedure>
				<list>
					<item>Using the keyboard or an assistive technology that emulates the keyboard, navigate to the image and activate the ONMOUSEOVER event.</item>
					<item>Using the keyboard or an assistive technology that emulates the keyboard, navigate off the image and activate the ONMOUSEOUT event.</item>					
				</list>
			</procedure>
			<testCode>
				<p><img id="lamp2" onmouseover="imgChange2('../images/tn_desklamp1.gif')" onmouseout="imgChange2('../images/desklamp2.gif')" src="../images/desklamp2.gif" height="32" width="25" alt="lamp-off" border="0" name="lamp2"/>
				</p>							
			</testCode>
      	<exResults>
				<list>
					<item>Image swaps with keyboard command</item>
				</list>
			</exResults>
			<sourcescript>
					function imgChange2( img )
					{
   					document.lamp2.src = img;
					}			
			</sourcescript>
		</test>		
		
		<test section="3">
			<procedure>
				<list>
					<item>Using the keyboard or an assistive technology that emulates the keyboard, navigate to the form element and activate the ONMOUSEOVER event.</item>
					<item>Using the keyboard or an assistive technology that emulates the keyboard, navigate off the form element and activate the ONMOUSEOUT event.</item>					
				</list>
			</procedure>
			<testCode>
				<form action="../action/return.html" method="post" onmouseover="change('lightblue')" onmouseout="change('red')">
				<input class="initial2" style="background-color: red" type="button" value="Test"/> 
				</form>			
			</testCode>
      	<exResults>
				<list>
					<item>Button color changes with keyboard command</item>
				</list>
			</exResults>
			<sourcescript>
					function change(color)
					{
						var el=event.srcElement
						if (el.tagName=="INPUT" &amp;&amp; el.type=="button")
						event.srcElement.style.backgroundColor=color
					}			
			</sourcescript>
		</test>				
						
	</content>

</testsuite>