| | |
smooth scrolling script needed
Please support our JavaScript / DHTML / AJAX advertiser: PostgreSQL or MySQL? Compare and contrast the two most popular open source databases
Thread Solved |
•
•
Join Date: Jan 2008
Posts: 2,052
Reputation:
Solved Threads: 118
i search for a ready script for smooth scrolling but i couldnt find any. So i did it myself as follows, it works perfectly
function elementPosition(obj) {
var curleft = 0, curtop = 0;
if (obj.offsetParent) {
curleft = obj.offsetLeft;
curtop = obj.offsetTop;
while (obj = obj.offsetParent) {
curleft += obj.offsetLeft;
curtop += obj.offsetTop;
}
}
return { x: curleft, y: curtop };
}
function ScrollToControl(id)
{
var elem = document.getElementById(id);
var scrollPos = elementPosition(elem).y;
scrollPos = scrollPos - document.documentElement.scrollTop;
var remainder = scrollPos % 50;
var repeatTimes = (scrollPos - remainder) / 50;
ScrollSmoothly(scrollPos,repeatTimes);
window.scrollBy(0,remainder);
}
var repeatCount = 0;
var cTimeout;
var timeoutIntervals = new Array();
var timeoutIntervalSpeed;
function ScrollSmoothly(scrollPos,repeatTimes)
{
if(repeatCount < repeatTimes)
{
window.scrollBy(0,50);
}
else
{
repeatCount = 0;
clearTimeout(cTimeout);
return;
}
repeatCount++;
cTimeout = setTimeout("ScrollSmoothly('" + scrollPos + "','"+ repeatTimes +"')",10);
}
example usage :
ScrollToControl('elementID');
it moves to the control smoothly;
function elementPosition(obj) {
var curleft = 0, curtop = 0;
if (obj.offsetParent) {
curleft = obj.offsetLeft;
curtop = obj.offsetTop;
while (obj = obj.offsetParent) {
curleft += obj.offsetLeft;
curtop += obj.offsetTop;
}
}
return { x: curleft, y: curtop };
}
function ScrollToControl(id)
{
var elem = document.getElementById(id);
var scrollPos = elementPosition(elem).y;
scrollPos = scrollPos - document.documentElement.scrollTop;
var remainder = scrollPos % 50;
var repeatTimes = (scrollPos - remainder) / 50;
ScrollSmoothly(scrollPos,repeatTimes);
window.scrollBy(0,remainder);
}
var repeatCount = 0;
var cTimeout;
var timeoutIntervals = new Array();
var timeoutIntervalSpeed;
function ScrollSmoothly(scrollPos,repeatTimes)
{
if(repeatCount < repeatTimes)
{
window.scrollBy(0,50);
}
else
{
repeatCount = 0;
clearTimeout(cTimeout);
return;
}
repeatCount++;
cTimeout = setTimeout("ScrollSmoothly('" + scrollPos + "','"+ repeatTimes +"')",10);
}
example usage :
ScrollToControl('elementID');
it moves to the control smoothly;
Due to lack of freedom of speech, i no longer post on this website.
![]() |
Other Threads in the JavaScript / DHTML / AJAX Forum
- Previous Thread: IE6 oddity, looking for workaround
- Next Thread: how to get scroll position of a window
| Thread Tools | Search this Thread |
acid2 ajax ajaxcode ajaxexample ajaxhelp animate array automatically beta box bug calendar cart checkbox class codes column createrange() css cursor date debugger decimal design dom download dropdown editor element embed enter error explorer firefox focus frameworks getselection google gwt hint html htmlform ie7 ie8 iframe images index internet java javascript javascripthelp2020 jawascriptruntimeerror jquery jsf jsfile jsp jump listbox maps masterpage math menu microsoft mimic mp4 object onmouseover onreadystatechange parent paypal php player position post problem programming progressbar prototype redirect regex runtime safari scale scriptlets search select shopping size sql text textarea toggle w3c web website window windowofwords windowsxp wysiwyg \n






