Hi,

The code below uses javascript to smoothly scroll content in a div. I don't need the smooth scrolling action, and only need the onclick action for the buttons. I would like to use this code so that if a scroll up/down button is pressed, the scroll would instantaneously jump up/down to a position, just like if you were to press the reset button (see demo link). If the down button is pressed, it would jump down the position of the content div (say 300px) and show the text instantaneously without showing how the scrolling text.

I am not familiar with JS, so it you know a shorter way, please suggest.

TIA

the demo link is HERE

The code is

>     this.easyscroll = function(){         // id of the container element      var
> id = "myContent";         // navigation
> buttons text  var nav = ["Scroll Up",
> "Scroll Down", "Reset"];      //  id for
> each navigation button (OPTIONAL)     var
> navId = ["btnUp", "btnDown",
> "btnReset"];
> 
>   // movement speed   var speed = 5;  
>   // desired height of the container
> element (in pixels)   var height = 200;
>       //  // END CONFIG   // do not edit
> below this line (unless you want to of
> course :) )   //
> 
>   var obj =
> document.getElementById(id);      obj.up
> = false;  obj.down = false;   obj.fast = false;
> 
>   var container =
> document.createElement("div");    var
> parent = obj.parentNode;
>   container.id="easyscroll";
>   parent.insertBefore(container,obj);
>   parent.removeChild(obj);        
>   container.style.position =
> "relative";   container.style.height =
> height + "px";
>   container.style.overflow = "hidden";
>   obj.style.position = "absolute";
>   obj.style.top = "0";    obj.style.left
> = "0";    container.appendChild(obj);         var btns = new Array();     var ul =
> document.createElement("ul");
>   ul.id="easyscrollnav";  for (var
> i=0;i<nav.length;i++){        var li =
> document.createElement("li");
>       li.innerHTML = nav[i];      li.id =
> navId[i];         btns.push(li);
>       ul.appendChild(li);     };
>   parent.insertBefore(ul,container);  
>   btns[0].onmouseover = function(){
>       obj.up = true;      this.className =
> "over";   };  btns[0].onmouseout =
> function(){       obj.up = false;
>       this.className = "";    };      
>   btns[1].onmouseover = function(){
>       obj.down = true;        this.className =
> "over";           };  btns[1].onmouseout =
> function(){       obj.down = false;
>       this.className = "";    };      
>   btns[0].onmousedown =
> btns[1].onmousedown = function(){
>       obj.fast = true;    };  
>   btns[0].onmouseup = btns[1].onmouseup
> = function(){         obj.fast = false;   };          btns[2].onmouseover =
> function(){               this.className =
> "over";   };      btns[2].onmouseout =
> function(){               this.className = "";
>   };          btns[2].onclick = function(){
>               obj.style.top = "0px";  };      
>           this.start = function(){                        var newTop;         var objHeight =
> obj.offsetHeight;         var top =
> obj.offsetTop;        var fast = (obj.fast)
> ? 2 : 1;      if(obj.down){                   newTop
> = ((objHeight+top) > height) ? top-(speed*fast) : top;    
>           obj.style.top = newTop + "px";
>       };          if(obj.up){                 newTop =
> (top < 0) ? top+(speed*fast) : top;
>           obj.style.top = newTop + "px";      };
>   };      obj.interval =
> setInterval("start()",50);                 };
> 
> 
> this.addEvent = function(obj,type,fn){
>   if(obj.attachEvent){
>       obj['e'+type+fn] = fn;
>       obj[type+fn] =
> function(){obj['e'+type+fn](window.event
> );}       obj.attachEvent('on'+type,
> obj[type+fn]);    } else {
>       obj.addEventListener(type,fn,false);
>   }; };
> addEvent(window,"load",easyscroll);