Wrox Home  
Search P2P Archive for: Go

  Return to Index  

javascript thread: Returning to the same page location when clicking a JavaScript link...


Message #1 by Kevin & Linda Lyons <lkkl@m...> on Mon, 23 Jul 2001 13:43:10 -0700
My question pertains to the file below when one returns to the original
page/file after clicking on the link.

First, copy and paste the code into a file and open the wordDoc.html file
in a browser.

Next, click the link, and then return to the wordDoc.html page.  You'll
notice that the location is now at the top of the page instead of the
location where the link was clicked.

Ideally what I would like is the page to remain where one clicked the link
rather than refreshing to the top of the page.  Is there an easy way to do
this without adding <a href="#word"> and <a name="word"> code to the
HTML/JavaScript functions?

The purpose of the existing JavaScript functions in the first place is so
that individuals can right-click to save the Word document or to click the
link to open a new window and keep the original page in the same location.

For example, in larger websites a user might want to return to the same
section of an article that they had been reading without losing their place

when the page is refreshed.

Thanks,

Kevin

------------------------------

wordDoc.html:

<html>
<head>
<script language="JavaScript">
function openWindow(URL) {
 var availWidth = screen.availWidth + 1;
 var availHeight = screen.availHeight;
 var x = 0, y = 0;
 if (document.all) {
  x = window.screenTop;
  y = window.screenLeft;
 }
 else if (document.layers) {
  x = window.screenX;
  y = window.screenY;
  availWidth = availWidth - 11;
  availHeight = availHeight - 155;
 }
 var arguments 



'resizable=yes,toolbar=yes,location=yes,directories=yes,addressbar=yes,scrollbars=yes,status=yes,menubar=yes,top=0,left=0,screenX='+
x+',screenY='+y+',width='+availWidth+',height='+availHeight;

 var newWindow = window.open(URL,'_blank',arguments);
}

function clickHref(aObj) {
 if (aObj.tagName == "A") {
  var strURL = window.location;
  strURL = aObj.href;
  aObj.href = window.location;
  openWindow(strURL);
 }
}
</script>
<style type="text/css">
a:link, a:visited, a:active { text-decoration: underline; color: blue; }
a:hover { text-decoration: underline; color: red; }
</style>
</head>
<body>
<center>
<hr size=1 noshade color=black width=654>
</center>
<table width=654 border=0 cellpadding=0 cellspacing=0>
<tr><td height=750>This space is here to add vertical scrollbars to test
the JavaScript code when returning to this page.</td></tr>
<tr><td>
<script language="JavaScript">
var msg='disclosure_form.doc';
var nomsg='';
if (document.all) {
 document.write("<font face=times color=#333333 size=2>The following link
<right-click mouse, select 'Save Target <u>A</u>s...'><br>provides
access to save/download the file as a <a
href='http://www.setco.org/download/disclosure_form.doc'
onmouseover='window.status=msg; return true';
onmouseout='window.status=nomsg; return true';
onclick=clickHref(this);><font face=times>Word
document</font></a>.</font>");
}
else if (document.layers) {
 document.write("<font face=times color=#333333 size=2>The following link
<right-click mouse, select '<u>S</u>ave Link As...'><br>provides
access to save/download the file as a <a
href='http://www.setco.org/download/disclosure_form.doc'
onmouseover='window.status=msg; return true';
onmouseout='window.status=nomsg; return true';
onclick=clickHref(this);><font face=times>Word
document</font></a>.</font>");
}
</script>
</td></tr>
</table>
</body>
</html>

------------------------------

Alternatively, how about using some variation of this clickHref() function
using either the scrollBy or scrollTo methods that I was testing.  Each
time I return to the original page it ends up appearing in the top left
instead of referencing either of the scrollBy or scrollTo methods:

function clickHref(aObj) {
 if (aObj.tagName == "A") {
  var strURL = window.location;
  strURL = aObj.href;
  aObj.href = window.location;
  window.scrollBy(0,330);
  //window.scrollTo(540, 540);
  //self.scrollBy(0,330);
  //self.scrollTo(540, 540);
  openWindow(strURL);
 }
}

I have also been looking at some links, and came across these that might be

very helpful.  The mouse-coordinates.html file could be utilized to
determine the X,Y position and then pass that into the clickHref()
function:

http://javascript.internet.com/page-details/mouse-coordinates.html
http://javascript.internet.com/page-details/mouse-coordinates-2.html
http://javascript.internet.com/page-details/floating-link.html

Thanks for your time and help,

Kevin


  Return to Index