Форум Сайтостроение Веб-строительство

самопроизвольная прокрутка при вводе строки

YL
На сайте с 09.07.2011
Offline
10
YuLink
900

Такая фигня наблюдается в Opere.

Если прокрутить слой вниз и что то начать вводить в поле ввода, то происходит прокрутка слоя наверх, кто знает как решить такую проблему (причем происходит это только если фиксированный слой выше основного).

Вот код: 

<!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" xml:lang="en" lang="en">

  <head>

    <title></title>

    <meta http-equiv="Content-Language" content="ru">

    <meta http-equiv="Content-Type" content="text/html; charset=windows-1251">

    <meta name="author" content="">

    <meta name="keywords" content="">

    <meta name="description" content="">

    <link rel="stylesheet" type="text/css" href="">

    <link rel="shortcut icon" type="image/x-icon" href="">

    <script language="JavaScript" type="text/javascript">

    <!--

      function stPr(e){

        return 1;

      }

    //-->

    </script>

    

  </head>

  <body>

    <div style="position:relative;height:700px;width:800px; overflow:auto;margin-top:100px;">

      <table cellspacing=0 cellpadding=0 width="100%" border="1px solid black">

        <tr>        <td width="50px"> <div style="height:30px">rrrrr 1</div></td>      </tr>

        <tr>        <td width="50px"> <div style="height:30px">rrrrr 2</div></td>      </tr>

        <tr>        <td width="50px"> <div style="height:30px">rrrrr 3</div></td>      </tr>

        <tr>        <td width="50px"> <div style="height:30px">rrrrr 4</div></td>      </tr>

        <tr>        <td width="50px"> <div style="height:30px">rrrrr 5</div></td>      </tr>

        <tr>        <td width="50px"> <div style="height:30px">rrrrr 6</div></td>      </tr>

        <tr>        <td width="50px"> <div style="height:30px">rrrrr 6</div></td>      </tr>

        <tr>        <td width="50px"> <div style="height:30px">rrrrr 7</div></td>      </tr>

        <tr>        <td width="50px"> <div style="height:30px">rrrrr 8</div></td>      </tr>

        <tr>        <td width="50px"> <div style="height:30px">rrrrr 9</div></td>      </tr>

        <tr>        <td width="50px"> <div style="height:30px">rrrrr 10</div></td>      </tr>

        <tr>        <td width="50px"> <div style="height:30px">rrrrr 1</div></td>      </tr>

        <tr>        <td width="50px"> <div style="height:30px">rrrrr 12</div></td>      </tr>

        <tr>        <td width="50px"> <div style="height:30px">rrrrr 13</div></td>      </tr>

        <tr>        <td width="50px"> <div style="height:30px">rrrrr 14</div></td>      </tr>

        <tr>        <td width="50px"> <div style="height:30px">rrrrr 1</div></td>      </tr>

        <tr>        <td width="50px"> <div style="height:30px">rrrrr 2</div></td>      </tr>

        <tr>        <td width="50px"> <div style="height:30px">rrrrr 3</div></td>      </tr>

        <tr>        <td width="50px"> <div style="height:30px">rrrrr 4</div></td>      </tr>

        <tr>        <td width="50px"> <div style="height:30px">rrrrr 5</div></td>      </tr>

        <tr>        <td width="50px"> <div style="height:30px">rrrrr 6</div></td>      </tr>

        <tr>        <td width="50px"> <div style="height:30px">rrrrr 7</div></td>      </tr>

        <tr>        <td width="50px"> <div style="height:30px">rrrrr 8</div></td>      </tr>

        <tr>        <td width="50px"> <div style="height:30px">rrrrr 9</div></td>      </tr>

        <tr>        <td width="50px"> <div style="height:30px">rrrrr 1</div></td>      </tr>

        <tr>        <td width="50px"> <div style="height:30px">rrrrr 1</div></td>      </tr>

        <tr>        <td width="50px"> <div style="height:30px">rrrrr 1</div></td>      </tr>

        <tr>        <td width="50px"> <div style="height:30px">rrrrr 2</div></td>      </tr>

        <tr>        <td width="50px"> <div style="height:30px">rrrrr 3</div></td>      </tr>

        <tr>        <td width="50px"> <div style="height:30px">rrrrr 4</div></td>      </tr>

        <tr>        <td width="50px"> <div style="height:30px">rrrrr 5</div></td>      </tr>

        <tr>        <td width="50px"> <div style="height:30px">rrrrr 6</div></td>      </tr>

        <tr>        <td width="50px"> <div style="height:30px">rrrrr 1</div></td>      </tr>

      </table>



      <div id="" style="position: fixed; left: 340px; top: 40px; z-index: 1002; background-color: #d3d3d3;

          width: 800px; height: 600px; overflow-x: auto; overflow-y: auto; display: block">



         <input size="40"  name="" type="text" value="jj"/>

      </div>

    </div>



  </body>

</html>

Авторизуйтесь или зарегистрируйтесь, чтобы оставить комментарий