smooth scroll on other tags (besides <a>)

[qwertyuiop]

I've been using a smooth scroll anchor script for a while. [source] Today i realized that it doesn't work with non-<a> elements.

If I had:
<div class="box" name="anchor" id="anchor">
And this:
<a href="#anchor">anchor</a>
Then the smooth scroll won't work. It seems to work only with "real anchors".

So my question: can this be modified to work with other elements, not just <a>?

THanks.

[A1ien51]

look at this:

http://radio.javaranch.com/pascarell...5293729000.htm

Eric

[qwertyuiop]

Hey, that's your site isnt it?

It was a broken link, but I looked around and found it anyway.

I'm not sure how I can use that code with this one. Isn't there a way that I can have an array of elements, including <a>, that it works with?

function ss_fixAllLinks()
{
var allLinks = document.getElementsByTagName('a'); <- like here
for (var i=0;i<allLinks.length;i++)
{
var lnk = allLinks[i];
if ((lnk.href && lnk.href.indexOf('#') != -1) &&
( (lnk.pathname == location.pathname) ||
('/'+lnk.pathname == location.pathname) ) &&
(lnk.search == location.search))
{
ss_addEvent(lnk,'click',smoothScroll);
}
}
}
function smoothScroll(e)
{
if (window.event)
{
target = window.event.srcElement;
}
else if (e)
{
target = e.target;
}
else return;
if (target.nodeType == 3)
{
target = target.parentNode;
}
if (target.nodeName.toLowerCase() != 'a') return;
anchor = target.hash.substr(1);
var allLinks = document.getElementsByTagName('a'); or here
var destinationLink = null;
for (var i=0;i<allLinks.length;i++)
{
var lnk = allLinks[i];
if (lnk.name && (lnk.name == anchor))
{
destinationLink = lnk;
break;
}
}
if (!destinationLink) return true;
var destx = destinationLink.offsetLeft;
var desty = destinationLink.offsetTop;
var thisNode = destinationLink;
while (thisNode.offsetParent &&
(thisNode.offsetParent != document.body))
{
thisNode = thisNode.offsetParent;
destx += thisNode.offsetLeft;
desty += thisNode.offsetTop;
}
clearInterval(ss_INTERVAL);
cypos = ss_getCurrentYPos();
ss_stepsize = parseInt((desty-cypos)/ss_STEPS);
ss_INTERVAL = setInterval('ss_scrollWindow('+ss_stepsize+','+desty+',"'+anchor+'")',10);
if (window.event)
{
window.event.cancelBubble = true;
window.event.returnValue = false;
}
if (e && e.preventDefault && e.stopPropagation)
{
e.preventDefault();
e.stopPropagation();
}
}
function ss_scrollWindow(scramount,dest,anchor)
{
wascypos = ss_getCurrentYPos();
isAbove = (wascypos < dest);
window.scrollTo(0,wascypos + scramount);
iscypos = ss_getCurrentYPos();
isAboveNow = (iscypos < dest);
if ((isAbove != isAboveNow) || (wascypos == iscypos))
{
window.scrollTo(0,dest);
clearInterval(ss_INTERVAL);
location.hash = anchor;
}
}
function ss_getCurrentYPos()
{
if (document.body && document.body.scrollTop)
return document.body.scrollTop;
if (document.documentElement && document.documentElement.scrollTop)
return document.documentElement.scrollTop;
if (window.pageYOffset)
return window.pageYOffset;
return 0;
}
function ss_addEvent(elm, evType, fn, useCapture)
{
if (elm.addEventListener)
{
elm.addEventListener(evType, fn, useCapture);
return true;
}
else if (elm.attachEvent)
{
var r = elm.attachEvent("on"+evType, fn);
return r;
}
}
var ss_INTERVAL;
var ss_STEPS = 25;
ss_addEvent(window,"load",ss_fixAllLinks);

Thanks.