470,644 Members | 1,204 Online
Bytes | Developer Community
New Post

Home Posts Topics Members FAQ

Post your question to a community of 470,644 developers. It's quick & easy.

click makes page scroll far right

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
Jul 23 '05 #1
7 3754
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>

Jul 23 '05 #2
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

Jul 23 '05 #3
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
Jul 23 '05 #4
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>
Jul 23 '05 #5
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>
Jul 23 '05 #6
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>');
}
}
Jul 23 '05 #7
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
Jul 23 '05 #8

This discussion thread is closed

Replies have been disabled for this discussion.

Similar topics

8 posts views Thread by George Hester | last post: by
5 posts views Thread by MacKenzieMouse | last post: by
4 posts views Thread by Lenny Shprekher | last post: by
1 post views Thread by xx75vulcan | last post: by
1 post views Thread by Korara | last post: by
By using this site, you agree to our Privacy Policy and Terms of Use.