click makes page scroll far right

[anna]

Is it possible to have a javascript function which can scroll a page
to the far right when a link is clicked? Any code examples available?

TIA,
Anna

[mscir]

anna wrote:

Is it possible to have a javascript function which can scroll a page
to the far right when a link is clicked? Any code examples available?

TIA,
Anna

Hi Anna,

I'd look at this approach:

function doit(direction) {
if (direction=='r')
window.scroll(700,1) //modify 1st number to change x position
if (direction=='l')
window.scroll(0,1) //modify 1st number to change x position
}

<table border="1" cellspacing="1" width="1400">
<tr>
<td width="222">
<input type="button" value="Right" onclick="doit('r')">
</td>
<td width="222">&nbsp;</td>
<td width="222">&nbsp;</td>
<td width="222">&nbsp;</td>
<td width="222">&nbsp;</td>
<td width="222">&nbsp;</td>
<td width="222">&nbsp;</td>
</tr>
<tr>
<td width="222">&nbsp;</td>
<td width="222">&nbsp;</td>
<td width="222">&nbsp;</td>
<td width="222">&nbsp;</td>
<td width="222">&nbsp;</td>
<td width="222">&nbsp;</td>
<td width="222">
<input type="button" value="Left" onclick="doit('l')">
</td>
</tr>
</table>

[mscir]

anna wrote:

Is it possible to have a javascript function which can scroll a page
to the far right when a link is clicked? Any code examples available?

TIA,
Anna

Code example here:

http://www.w3schools.com/js/tryit.as...js_scrollright

[anna]

I tried the examples and it works fine with input type=button but
doesn't work with type=image.

Any way to make it work? Using the image look less clunky.

<input type="button" value=">>" onClick="alignRight();"> //this works

<input type="image" src="/icons/redarrow.gif" onClick="alignRight();">
//rather have this work

[anna]

What I ended up doing and it works for browsers NN4, NN7, and IE6.

<a href="javascript:window.scrollTo(1000,0)"><img
src="/icons/redarrow.gif" border=0 alt="Scroll right"></a>

[anna]

SOLUTION:
What I ended up doing and it works for browsers NN4, NN7, and IE6.

<a href="javascript:window.scrollTo(1000,0)"><img
src="/icons/redarrow.gif" border=0 alt="Scroll right"></a>

[anna]

FOLLOWUP
if (navigator.appName.indexOf("Netscape") != -1 &&
parseFloat(navigator.appVersion) < 5 ) {
if (document.width > window.innerWidth) {
document.write('<a
href="javascript:window.scrollTo(1000,window.pageY Offset)"><img
src="/icons/redarrow.gif" border=0 alt="Scroll right"><img
src="/icons/redarrow.gif" border=0 alt="Scroll right"></a>');
}
} else {
if (document.body.scrollWidth > document.body.clientWidth) {
document.write('<a
href="javascript:window.scrollTo(1000,document.bod y.scrollTop)"><img
src="/icons/redarrow.gif" border=0 alt="Scroll right"><img
src="/icons/redarrow.gif" border=0 alt="Scroll right"></a>');
}
}

[Thomas 'PointedEars' Lahn]

anna wrote:

FOLLOWUP
Do you really know what a followup is and what medium you are using?

<http://www.faqs.org/faqs/usenet/posting-rules/part1/>
if (navigator.appName.indexOf("Netscape") != -1 &&
parseFloat(navigator.appVersion) < 5 ) {
Nonsense. <http://pointedears.de.vu/scripts/test/whatami>

Better:

if (typeof document.width != "undefined"
&& typeof document.innerWidth != "undefined")
{
if (document.width > window.innerWidth) {
document.write('<a
href="javascript:window.scrollTo(1000,window.pageY Offset)"><img ^^^^^^^^^^^^
Nonsense. <http://jibbering.com/faq/#FAQ4_24>

Better:

if (document.width > window.innerWidth) {
document.write(
'<a
+ ' href="javascript:void(window.scrollTo(1000,window. pageYOffset))"'
+ ' onclick="window.scrollTo(1000, window.pageYOffset); return false"'
+ '><img ...');
src="/icons/redarrow.gif" border=0 alt="Scroll right"><img
src="/icons/redarrow.gif" border=0 alt="Scroll right"></a>');
This will not work as supposed if you provide only one link with two images.
}
} else {
if (document.body.scrollWidth > document.body.clientWidth) {
Again you did not test for those host objects and their properties before
accessing them. See above.
document.write('<a
href="javascript:window.scrollTo(1000,document.bod y.scrollTop)"><img
See above.
src="/icons/redarrow.gif" border=0 alt="Scroll right"><img
src="/icons/redarrow.gif" border=0 alt="Scroll right"></a>');
See above.
}
}

PointedEars