Hi Everyone,
I have a form designed with a table and the table is inside a <div> (Required. Can’t get rid of it). The div has style “height: 100% and scrollable: auto”.
The issue: In IE, let say, the form is bit longer and overflowed the page so the div has got vertical scroll bar. Now I am inserting data in the form.
Inserted the 1st data and press tab to next input and insert the 2nd data.
Now my cursor is in 2nd input type.
Now I would like to see how many data I have to insert and I have drag the scroll bar with mouse and went down and dragged up again to the top to continue inserting data.
Expectation: The cursor should be there where I kept it (i.e. 2nd input type!!)! I can insert/modify the data in 2nd input type or I will press tab to go to the next input and insert the 3rd data in it!! Right!!
But Strange!! The cursor has been lost from that place. By pressing tab I moved to the top of the page or to the 1st input type.
It’s working as par the expectation in Firefox (for a changeJ).
Observation: while inserting datain any input type, at the time I click on the scroll bar to drag it, the curser getting lost from the input type in IE. But it remains with the input type in Firefox (As expected).
I have noticed 1 thing. It behaves like that way in IE (All versions) if I play with the height any way of the above mentioned “div”. But I have to mention the div height to get auto scroll.
Here is the test code.... please have a look. Hope it will give you the proper picture
<html>
<head>
<meta>
<title>Untitled Document</title>
</head>
<body>
<div style="height:100%; width:100%; overflow: auto;">
<table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td>
<input type="text" name="textfield" /> </td>
</tr>
<tr>
<td> </td>
</tr>
<tr>
<td>1. Click and place the cursor in the above text input. Drag the page down and come back. Now see, cursor is not there.<br><strong>OR</strong><br>2. Click and place the cursor in the above text input. Just click on the scroll bar and see the cursor will disappear from the input type.<br><br>Workimg fine in Firefox.
<p> </p> <p> </p> <p> </p> <p> </p> <p> </p> <p> </p> <p> </p> <p> </p> <p> </p> <p> </p> <p> </p> <p> </p> <p> </p> <p> </p> <p> </p> <p> </p> <p> </p>
</td>
</tr>
</table>
</div>
</body>
</html>
Friends!! It will become a huge accessibility issue for me. Pleeeeeeease help.
Thanks,
Kallol
Last edited by kallol; 04-10-2007 at 03:12 AM..
|
