Hi,

In my project I am calling ul and li data in Iframe and when I click on link then it move fucus on top instead of selected item.

Following is the example of the problem.

testFrame.htm


Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Tree Frame</title>
</head>
<body>
<table width="50%" border="0">
<tr id="frameRow">
<td>
<iframe id="treeFrame" src="treeFrame2.htm" width="50%" height="100%" scrolling="yes" frameborder="0">
</iframe>
<td>
</tr>
</table>
</body>
</html>
testFrame2.htm

Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Test Frame2</title>
<script language="javascript" type="text/javascript">
function focusMe(id)
{
documentBygetelementsbyid(id).focus();

}
</script>
</head>

<body>
<ul>
  <li><a href="#" id="1" onclick="javascript:focusMe('1');">menu1</a></li>
  <li><a href="#" id="2" onclick="javascript:focusMe('2');">menu2</a></li>
  <li><a href="#" id="3" onclick="javascript:focusMe('3');">memnu3</a></li>
  <li><a href="#" id="4" onclick="javascript:focusMe('4');">menu4</a></li>
  <li><a href="#" id="5" onclick="javascript:focusMe('5');">menu5</a></li>
  <li><a href="#" id="6" onclick="javascript:focusMe('6');">menu6</a></li>
  <li><a href="#" id="7" onclick="javascript:focusMe('7');">menu7</a></li>
  <li><a href="#" id="8" onclick="javascript:focusMe('8');">menu8</a></li>
  <li><a href="#" id="9" onclick="javascript:focusMe('9');">menu9</a></li>
  <li><a href="#" id="10" onclick="javascript:focusMe('10');">menu10</a></li>
  <li><a href="#" id="11" onclick="javascript:focusMe('11');">menu11</a></li>
  <li><a href="#" id="12" onclick="javascript:focusMe('12');">menu12</a></li>
  <li><a href="#" id="13" onclick="javascript:focusMe('13');">menu13</a></li>
  <li><a href="#" id="14" onclick="javascript:focusMe('14');">menu14</a></li>
  <li><a href="#" id="15" onclick="javascript:focusMe('15');">menu15</a></li>

</ul>
</body>
</html>


Any Solution?


- Thanks
Zohaib.