<script>

/* Browser detection code by Kruglov */
isDOM=document.getElementById //DOM1 browser (MSIE 5+, Netscape 6, Opera 5+)
isOpera=isOpera5=window.opera && isDOM //Opera 5+
isOpera6=isOpera && window.print //Opera 6+
isOpera7=isOpera && document.readyState //Opera 7+
isMSIE=document.all && document.all.item && !isOpera //Microsoft Internet Explorer 4+
isMSIE5=isDOM && isMSIE //MSIE 5+
isNetscape4=document.layers //Netscape 4.*
isMozilla=isDOM && navigator.appName=="Netscape" //Mozilla или Netscape 6.*
/* End code */


/* Div scroll by Pimenov Dmitriy */
var timer;
var divWidth = 300;
var scrollWidth = 0;
var scrollSpeed = 3;
var scrollStep = 50;

if(isNetscape4 || isMozilla)
{
        scrollWidth = 18;
}
else
{
        scrollWidth = 16;
}

function myScrollStart(dir)
{
        if(dir == 'up')
        {
                timer=setInterval('myScrollUp()', scrollStep);
        }
        else
        {
                timer=setInterval('myScrollDown()', scrollStep);
        }
}

function myScrollUp()
{
        document.getElementById('divscroll').style.width = (divWidth+scrollWidth)+'px';
        document.getElementById('divscroll').style.overflow='auto';
        document.getElementById('divscroll').scrollTop-=scrollSpeed;
}

function myScrollDown()
{
        document.getElementById('divscroll').style.width = (divWidth+scrollWidth)+'px';
        document.getElementById('divscroll').style.overflow='auto';
        document.getElementById('divscroll').scrollTop+=scrollSpeed;
}

function myScrollTop()
{
        document.getElementById('divscroll').style.width = (divWidth+scrollWidth)+'px';
        document.getElementById('divscroll').style.overflow='auto';
        document.getElementById('divscroll').scrollTop=0;
}

function myScrollBottom()
{
        document.getElementById('divscroll').style.width = (divWidth+scrollWidth)+'px';
        document.getElementById('divscroll').style.overflow='auto';
        document.getElementById('divscroll').scrollTop=10000;
}

function myScrollClear()
{
        clearInterval(timer);
}
/* End code */

</script>


<div id="content" style="position: relative; z-index: 1; overflow: hidden; width: 300px; height: 200px; border: 1px red solid;">

<div id="divscroll" style="position: relative; z-index: 2; overflow: hidden; width: 100%; height: 100%; padding: 10px;">

&nbsp;&nbsp;&nbsp;&nbsp;Пример текста. Пример текста. Пример текста. Пример текста. Пример текста. Пример текста. Пример текста. Пример текста. Пример текста. Пример текста. Пример текста. Пример текста. Пример текста. Пример текста. Пример текста. Пример текста. Пример текста. Пример текста. Пример текста. Пример текста. Пример текста. Пример текста. Пример текста. Пример текста. Пример текста. Пример текста. Пример текста. Пример текста. Пример текста. Пример текста. Пример текста. Пример текста. Пример текста. Пример текста.
<br><br>
&nbsp;&nbsp;&nbsp;&nbsp;Пример текста. Пример текста. Пример текста. Пример текста. Пример текста. Пример текста. Пример текста. Пример текста. Пример текста. Пример текста. Пример текста. Пример текста. Пример текста. Пример текста. Пример текста. Пример текста. Пример текста. Пример текста. Пример текста. Пример текста. Пример текста. Пример текста. Пример текста. Пример текста. Пример текста. Пример текста. Пример текста. Пример текста. Пример текста. Пример текста. Пример текста. Пример текста. Пример текста. Пример текста.
<br><br>
&nbsp;&nbsp;&nbsp;&nbsp;Пример текста. Пример текста. Пример текста. Пример текста. Пример текста. Пример текста. Пример текста. Пример текста. Пример текста. Пример текста. Пример текста. Пример текста. Пример текста. Пример текста. Пример текста. Пример текста. Пример текста. Пример текста. Пример текста. Пример текста. Пример текста. Пример текста. Пример текста. Пример текста. Пример текста. Пример текста. Пример текста. Пример текста. Пример текста. Пример текста. Пример текста. Пример текста. Пример текста. Пример текста.

</div>

</div>


<table>
<tr>

<td><a href="" onmouseover="myScrollTop();">Top</a></td>
<td><a href="" onmouseover="myScrollStart('up');" onmouseout="myScrollClear()">Up</a></td>
<td><a href="" onmouseover="myScrollStart('down');" onmouseout="myScrollClear()">Down</a></td>
<td><a href="" onmouseover="myScrollBottom();">Bottom</a></td>

</tr>
</table>

<script>

/* Browser detection code by Kruglov */
isDOM=document.getElementById //DOM1 browser (MSIE 5+, Netscape 6, Opera 5+)
isOpera=isOpera5=window.opera && isDOM //Opera 5+
isOpera6=isOpera && window.print //Opera 6+
isOpera7=isOpera && document.readyState //Opera 7+
isMSIE=document.all && document.all.item && !isOpera //Microsoft Internet Explorer 4+
isMSIE5=isDOM && isMSIE //MSIE 5+
isNetscape4=document.layers //Netscape 4.*
isMozilla=isDOM && navigator.appName=="Netscape" //Mozilla или Netscape 6.*
/* End code */


/* Div scroll by Pimenov Dmitriy */
var timer;
var divWidth = 70;
var divHeight = 70;
var scrollWidth = 0;
var scrollHeight = 0;
var scrollSpeed = 3;
var scrollStep = 50;

if(isNetscape4 || isMozilla)
{
        scrollWidth = 18;
        scrollHeight = 18;
}
else
{
        scrollWidth = 16;
        scrollHeight = 16;
}

function myScrollStart(dir)
{
        if(dir == 'up')
        {
                timer=setInterval('myScrollUp()', scrollStep);
        }
        else
        {
                timer=setInterval('myScrollDown()', scrollStep);
        }
}

function myScrollStartu(dir)
{
        if(dir == 'left')
        {
                timer=setInterval('myScrollleft()', scrollStep);
        }
        else
        {
                timer=setInterval('myScrollright()', scrollStep);
        }
}

function myScrollUp()
{
        document.getElementById('divscroll').style.width = (divWidth+scrollWidth)+'px';
        document.getElementById('divscroll').style.overflow='auto';
        document.getElementById('divscroll').scrollTop-=scrollSpeed;
}

function myScrollDown()
{
        document.getElementById('divscroll').style.width = (divWidth+scrollWidth)+'px';
        document.getElementById('divscroll').style.overflow='auto';
        document.getElementById('divscroll').scrollTop+=scrollSpeed;
}

function myScrollTop()
{
        document.getElementById('divscroll').style.width = (divWidth+scrollWidth)+'px';
        document.getElementById('divscroll').style.overflow='auto';
        document.getElementById('divscroll').scrollTop=0;
}

function myScrollBottom()
{
        document.getElementById('divscroll').style.width = (divWidth+scrollWidth)+'px';
        document.getElementById('divscroll').style.overflow='auto';
        document.getElementById('divscroll').scrollTop=10000;
}

function myScrollleft()
{
        document.getElementById('divscroll').style.height = (divWidth+scrollHeight)+'px';
        document.getElementById('divscroll').style.overflow='auto';
        document.getElementById('divscroll').scrollLeft-=scrollSpeed;
}

function myScrollright()
{
        document.getElementById('divscroll').style.height = (divWidth+scrollHeight)+'px';
        document.getElementById('divscroll').style.overflow='auto';
        document.getElementById('divscroll').scrollLeft+=scrollSpeed;
}

function myScrollLeft()
{
        document.getElementById('divscroll').style.height = (divWidth+scrollHeight)+'px';
        document.getElementById('divscroll').style.overflow='auto';
        document.getElementById('divscroll').scrollLeft=0;
}

function myScrollRight()
{
        document.getElementById('divscroll').style.height = (divWidth+scrollHeight)+'px';
        document.getElementById('divscroll').style.overflow='auto';
        document.getElementById('divscroll').scrollLeft=10000;
}

function myScrollClear()
{
        clearInterval(timer);
}
/* End code */

</script>


<div id="content" style="position: relative; z-index: 1; overflow: hidden; width: 70px; height: 70px; border: 1px red solid;">

<div id="divscroll" style="position: relative; z-index: 2; overflow: hidden; width: 100%; height: 100%; padding: 10px;">

Пример текста. Пример текста. Пример текста.

</div>

</div>


<table>
<tr>

<td><a href="" onmouseover="myScrollTop();">Top</a></td>
<td><a href="" onmouseover="myScrollStart('up');" onmouseout="myScrollClear()">Up</a></td>
<td><a href="" onmouseover="myScrollStart('down');" onmouseout="myScrollClear()">Down</a></td>
<td><a href="" onmouseover="myScrollBottom();">Bottom</a></td>
</tr>
<td><a href="" onmouseover="myScrollLeft();">Left</a></td>
<td><a href="" onmouseover="myScrollStartu('left');" onmouseout="myScrollClear()">leftp</a></td>
<td><a href="" onmouseover="myScrollStartu('right');" onmouseout="myScrollClear()">right</a></td>
<td><a href="" onmouseover="myScrollRight();">Right</a></td>

</tr>
</table>