By using this site, you agree to our updated Privacy Policy and our Terms of Use. Manage your Cookies Settings.
429,313 Members | 2,798 Online
Bytes IT Community
+ Ask a Question
Need help? Post your question and get tips & solutions from a community of 429,313 IT Pros & Developers. It's quick & easy.

Best Java Script Scroller

P: n/a
Hello,


Can somebody recommend me a Java Script scroller that can scroll an
i-frame ? I tried the Tigra scroller
(www.softcomplex.com/products/tigra_scroller/) but sometimes it does
not appear at all on my web page (www.mihaiu.name). It doesn't seem
to be reliable...
Any input is appreciated.

Regards,
Razvan

Aug 22 '05 #1
Share this Question
Share on Google+
3 Replies


P: n/a
Razvan <mi*****@mailcity.com> wrote in message news:11**********************@g44g2000cwa.googlegr oups.com...
Hello,


Can somebody recommend me a Java Script scroller that can scroll an
i-frame ?


This is an update of a scroller I wrote long ago.
It will scroll any document, whether or not it's in an iframe.
I can't upload it to webspace currently, so here's the entire thing.

/**** SmartScroll (C)2000-05 Stephen Chalmers ******************

Provides CONTROLLABLE vertical auto scrolling of a document.
Best used to scroll frame windows containing long text passages.
Retains functionality of the vertical scroll bar, which additionally
is used to change scroll direction. Any horizontal offset is preserved.

Compatibility: NN4+ / Mozilla derivatives / IE4+ / Opera 5+

-- Installation --

Assuming the script is saved as smartscroll.js

<script type='text/javascript' src='smartscroll.js'></script>

In the BODY tag, include: onload='SCstartScroll()'

Optionally, set one or more user parameters thus:

<script type='text/javascript'>
SCdelay=130;
SCwrap=true;
SCmouseOver=false;
supportNN=true;
</script>

Their purpose is described below.

-- Setup --

To set the scroll speed, alter the value of 'SCdelay'. The higher the
value, the slower the scrolling. Default == 100.

There are two scroll modes, selected by setting the true/false state of 'SCwrap':

Alternate [false] - scroll direction changes at each end. (Default)

Wrap [true] - content scrolls upwards only, at bottom jumps back to top.

When using Wrap mode, to allow the text to disappear off the screen and re-appear
cleanly at the bottom, the page content should be padded with sufficient blank space,
top and bottom.

NOTE: Under Netscape 4.xx, if the page displays both scrollbars, scrolling may be erratic.
If this is likely to occur, set 'supportNN' to false.

-- Operation --

There are two control modes, selected by the true/false state of 'SCmouseover':

Mouseover [true] - Scrolling stops when the mouse is over the document and resumes
when it leaves.

Click [false] - Toggle scrolling ON/OFF by clicking anywhere on the page (or scrollbar
on Gecko browsers).
Toggle scroll direction with paired clicks anywhere on the page.

In both modes, change scroll direction by moving the scrollbar in the desired direction,
or with the up/down cursor keys (frame must have focus).
*** Do not edit below this line (unless you can't resist it) ***/

var SCpageY=0, SCxPoint=0, SCyPoint=0, SCup=-1, SCdn=1, SCdir=SCdn, SCmoved,
SCoffsetType=0, SColdY=-1, SCtravel=0, SCcount=-1, SCScrollEnable=true,
SCwait=1, SCpausedAt=0,

SCmouseOver=true,// - User variables -
SCdelay=100, // Alter these from script tags
SCwrap=false, // within the calling document.
supportNN=true; //
function SCgetPageX( idx )
{
var r=0;

switch(idx)
{
case 1 : r=window.pageXOffset;break
case 2 : r=document.documentElement.scrollLeft;break;
case 3 : r=document.body.scrollLeft;
}

return r;
}

function SCgetPageY( idx )
{
var r=0;

switch(idx)
{
case 1 : r=window.pageYOffset;break
case 2 : r=document.documentElement.scrollTop;break;
case 3 : r=document.body.scrollTop;
}

return r;
}

function SCSmartScroll()
{
SCnow=new Date();

if(SCScrollEnable)
{
if(SCpausedAt) // paired-click detector
{
if(SCpausedAt+500 > SCnow.getTime()) // compare current time with pause time
SCdir=-SCdir;
SCpausedAt=0;
}

SCxPoint=SCgetPageX(SCoffsetType);
// Read reported page position
SCyPoint=SCgetPageY(SCoffsetType);

if( (SCmoved=Math.abs(SCtravel=(SCyPoint-SColdY))) >2 ) // Check for deviant movement
{ // caused by scrollbar use.
SCcount=-1;

if( (SCtravel<0 && SCdir==SCdn) || (SCtravel>0 && SCdir==SCup) )
SCdir=-SCdir;

SCpageY=SCyPoint; // Update stored page position
}
else
if(SCmoved>0) // Check for movement..
SCcount=-1;
else
if(SCcount==-1) // on failure start counter
SCcount=SCwait;

if(SCcount==-1)
SColdY=SCyPoint;
else // Wait period necessitated by NN, which intermittently
{ // delays reporting of correct Y position.

if(SCcount==0) // No movement after wait period,
if(SCwrap==true && SCdir>0) // wrap
SCpageY=0;
else
SCpageY=SColdY; // assume end reached and change direction

SCdir=-SCdir;
}

SCcount--;
}

window.scrollTo(SCxPoint, SCpageY+=SCdir); // move page
}
else
if(SCpausedAt==0) // record time at pause
SCpausedAt=SCnow.getTime();

setTimeout("SCSmartScroll()",SCdelay);
}

function SCstartScroll()
{
SCoffsetType=(window.pageXOffset!=null) ? 1
: ( document.compatMode && document.compatMode != 'BackCompat' ) ? 2
: ( document.body && typeof(document.body.scrollTop)!='undefined') ? 3
: 0;

if( document.layers )
if( supportNN==false )// Inhibit NN4 where selected.
SCoffsetType=0;
else
SCmouseOver=false;

if( SCoffsetType!=0 && window.scrollTo )
{
if(SCmouseOver)
if(window.Event && document.captureEvents)
{
document.captureEvents(Event.MOUSEOVER);
document.captureEvents(Event.MOUSEOUT);
}
document.onmouseout=function(){SCScrollEnable=true ;};
document.onmouseover=function(){SCScrollEnable=fal se;};
}
else
{
if(window.Event && document.captureEvents)
document.captureEvents(Event.MOUSEUP);
document.onmouseup=function(){SCScrollEnable^=true ;}
}

SCSmartScroll();
}
}


Aug 23 '05 #2

P: n/a
Hi Stephen,

Thanks a lot for your code.
Can I see somewhere the scroller in action ? How well is it tested
? I can test with the current version of Opera, Firefox, Netscape, IE
5.0 - IE5.5-IE6.0 but that may not be enough. For example if the
scripts works with Firefox 1.0.6 but breaks with Firefox 1.0.1 that is
not good. The same is true for other browsers. This is why I am saying
that proper testing must be done.
Can you help me to debug the script if necessary ? I am a
developer myself with some JavaScript experience but I do not have a
lot of time. If I can receive feed-back for you that could save days in
debug time - of course, if that is necessary.
Btw, the site where I want to put it is www.mihaiu.name. It
should replace the Tigra scroller that you can see on the upper left
side of the screen.
Regards,
Razvan

Aug 23 '05 #3

P: n/a
Razvan <mi*****@mailcity.com> wrote in message news:11**********************@g43g2000cwa.googlegr oups.com...
Hi Stephen,

Thanks a lot for your code.
Can I see somewhere the scroller in action ? How well is it tested
? I can test with the current version of Opera, Firefox, Netscape, IE
5.0 - IE5.5-IE6.0 but that may not be enough. For example if the
scripts works with Firefox 1.0.6 but breaks with Firefox 1.0.1 that is
not good. The same is true for other browsers. This is why I am saying
that proper testing must be done.
Can you help me to debug the script if necessary ? I am a
developer myself with some JavaScript experience but I do not have a
lot of time. If I can receive feed-back for you that could save days in
debug time - of course, if that is necessary.
Btw, the site where I want to put it is www.mihaiu.name. It
should replace the Tigra scroller that you can see on the upper left
side of the screen.


I don't know how the Tigra scroller works, namely whether it is actually scrolling an iframe as you requested, or
something else.

The script is demonstrated at http://www.hotspot.freeserve.co.uk/ss/

The only issue I can find is with Safari on the Mac; the document's mouseout event either is not supported or does not
fire. This may have been fixed on later versions.

In five years I've never encountered a problem on Windows browsers, and I see no need to test it on every minor revision
of every browser.

Caveat auctor

--
Stephen Chalmers http://makeashorterlink.com/?H3E82245A

Aug 24 '05 #4

This discussion thread is closed

Replies have been disabled for this discussion.