<html> 
  <head> 
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
  <title>scrollbar</title> 
   
  <script type="text/javascript"> 
    var gTop=0; 
    var gIncVal=0; 
    // var timeOutValue can be used to adjust the speed of scroller. 
    var timeOutValue=10; 
       
       
    function scrollMe(arg) 
    {     
      var objEncNav=document.getElementById('encNav'); 
       
      // var scrollAmount define the fast and 
      // the amount of scrolling pane 
      var scrollAmount=25; 
      var objEncNavHeight=parseInt(objEncNav.offsetHeight); 
      var objEncNavTop=objEncNav.style.top; 
       
      // var barHeight defines the heigt of inner layer 
      // it must set -10 from max height 
      var barHeight=160;    
       
      if(!objEncNavTop) 
        objEncNavTop=0; 
      else 
        objEncNavTop=objEncNavTop.substring(0,objEncNavTop.length-2); 
         
      if(arg>0) 
      { 
        if(objEncNavTop>=0 || objEncNavTop>(-(objEncNavHeight-(barHeight+scrollAmount)))) 
        { 
          incrementValue=scrollAmount; 
        } 
        else if(objEncNavTop<(-(objEncNavHeight-(barHeight+scrollAmount)))) 
        { 
          incrementValue=(objEncNavHeight-barHeight)+parseInt(objEncNavTop); 
        } 
        else 
        { 
          incrementValue=0; 
        } 
        encSmoothScroll("minus", parseInt(objEncNavTop), parseInt(incrementValue)); 
      } 
      else 
      { 
        if(objEncNavTop<0 && ((parseInt(objEncNavTop)+scrollAmount) < 0)) 
        { 
          incrementValue=scrollAmount; 
        } 
        else 
        { 
          incrementValue=-objEncNavTop-0;      
        } 
        encSmoothScroll("plus", parseInt(objEncNavTop), parseInt(incrementValue)); 
      } 
    } 
    function encSmoothScroll(dir, currentVal, incValue) 
    { 
      gTop=currentVal; 
      gIncVal=incValue; 
      encScrollBy(dir, 0) 
    } 
    function encScrollBy(dir, val) 
    {  
      if(val<gIncVal) 
      { 
        var tmpInc;       
        if((gIncVal-val)>1)       
        { 
          tmpInc=Math.ceil((gIncVal-val)/10); 
          if(tmpInc <1) 
            tmpInc=1; 
        } 
        else 
        { 
          tmpInc=gIncVal-val; 
        } 
         
        val+=tmpInc; 
         
        var objEncNav=document.getElementById('encNav'); 
        if(dir=="plus") 
        { 
          objEncNav.style.top=gTop+val+"px"; 
        } 
        else if(dir=="minus") 
        { 
          objEncNav.style.top=gTop-val+"px"; 
        } 
        var t=setTimeout("encScrollBy('"+dir+"', "+val+");", timeOutValue); 
      } 
      else 
      { 
        clearTimeout(t); 
      } 
    } 
    </script> 
    <style type="text/css"> 
    #encNav 
      { 
  	position:relative; 
  	color:#000; 
  	top:0px; 
  	width: 500px; 
  	height: 200px; 
  	float: left; 
      } 
  	</style> 
  </head> 
   
  <body> 
   
  <div id="encNav"> 
         <ul> 
         <li>deneme metni</li> 
         <li>deneme metni</li> 
         <li>deneme metni</li> 
         <li>deneme metni</li> 
         <li>deneme metni</li> 
         <li>deneme metni</li> 
         <li>deneme metni</li> 
         <li>deneme metni</li> 
         </ul> 
          </div> 
  <table width="28" border="0" cellspacing="0" cellpadding="0"> 
    <tr> 
      <td width="28" height="16"><a data-test="test" rel="nofollow" style="word-wrap: break-word; text-decoration: underline;" target="_blank" onclick="return dhExternalLinkRedirect(this)" href="/ExternalLinkRedirect?module=pgdcode&messageId=38519168&url=#" onClick="scrollMe(-1); return false;" data-href="#" onClick="scrollMe(-1); return false;">yukari</a></td> 
    </tr> 
    <tr> 
      <td height="125"> </td> 
    </tr> 
    <tr> 
      <td height="16"><a data-test="test" rel="nofollow" style="word-wrap: break-word; text-decoration: underline;" target="_blank" onclick="return dhExternalLinkRedirect(this)" href="/ExternalLinkRedirect?module=pgdcode&messageId=38519168&url=#" onClick="scrollMe(1); return false;" data-href="#" onClick="scrollMe(1); return false;">asagi</a></td> 
    </tr> 
  </table> 
  </body> 
  </html>