Jump to content

Can't make link go to top of website


kvnirvana

Recommended Posts

How do I get the page to go to the top when the link is clicked?

I know I can do it with an anchor on the same page, but the problem is that the top of the page is a banner on my index site

 

This is my index site. The top of the page is sea.jpg

 

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<HTML>
<HEAD>
<META http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<TITLE>SearchCare</TITLE>
<script language="JavaScript">
<!--
function calcHeight()
{
//find the height of the internal page
var the_height=
document.getElementById('the_iframe').contentWindow.
document.body.scrollHeight;

//change the height of the iframe
document.getElementById('the_iframe').height=
the_height;
}
//-->
</script>
</HEAD>

<BODY >



<DIV style="position:absolute;left:0px;top:0px;width:100%;height:100%;z-index:1" align="left">
<TABLE width="100%" height="100%" border="0" cellpadding="0" cellspacing="0">
<img src="sea.jpg" width="1259" height="170" />

</TABLE></DIV>



<DIV style="position:absolute;center:0px;top:143px;width:100%;height:100%;z-index:1" align="left">
<TABLE  width="100%" height="100%" border="0" cellpadding="0" cellspacing="1">
<TR>
<TD align="left" valign="top" width="122" height="100%"><FONT style="font-size:18px" color="#000000" face="Arial"><B><A href="for.php" target="kasp">For</B></FONT></TD>
<TD align="left" valign="top" width="122" height="100%"><FONT style="font-size:18px" color="#000000" face="Arial"><B><A href="igen.php" target="kasp">Si</A></B></FONT></TD>
<TD align="left" valign="top" width="160" height="100%"><FONT style="font-size:18px" color="#000000" face="Arial"><B><A href="bedo.php" target="kasp">Be </B></FONT></TD>
<TD align="left" valign="top" width="122" height="100%"><FONT style="font-size:18px" color="#000000" face="Arial"><B><A href="ord.php" target="kasp">Ord</B></FONT></TD>

<TD align="left" valign="top" width="122" height="100%"><FONT style="font-size:18px" color="#000000" face="Arial"><B><A href="forum.php" target="kasp">Forum</B></FONT></TD>
<TD align="left" valign="top" width="122" height="100%"><FONT style="font-size:18px" color="#000000" face="Arial"><B><A href="kontakt.php" target="kasp">Kontakt</B></FONT></TD>
</TR>
</TABLE></DIV>
<DIV style="position:absolute;center:0px;top:165px;width:100%;height:100%;z-index:1" align="left"><TABLE width="100%" height="100%" border="0" cellpadding="0" cellspacing="1"><TR><TD align="left" valign="top" width="100%" height="40"><FONT style="font-size:16px" color="#000000" face="Arial"><B><hr></B></FONT></TD></TR></TABLE></DIV>

<iframe width="100%" id="the_iframe" name="kasp" onLoad="calcHeight();" style="position:absolute;center:1px;top:203px;z-index:2" src="forside.php" scrolling="NO" frameborder="0" height="1"> iframe capable browser is required to view this web site.</iframe>

</BODY>
</HTML>

 

This is the page called ord.php from where I want the link when clicked to go to the top of the index page

 

<?php require('_ting.php'); ?>


<html>


<head>
<link rel="stylesheet" type="text/css" href="noi.css" />

</head>

<body>
<p>

</p>

<p style='font-family:verdana;font-size:150%;'>

<a  href="?by=A">A</a> | <a  href="?by=B">B</a> | <a  href="?by=C">C</a> |<a  href="?by=D">D</a> | <a  href="?by=E">E</a> | <a  href="?by=F">F</a>| <a  href="?by=G">G</a> | <a  href="?by=H">H</a> |<a  href="?by=I">I</a> | <a  href="?by=J">J</a> | <a  href="?by=K">K</a>| <a  href="?by=L">L</a> | <a  href="?by=M">M</a> |<a  href="?by=N">N</a> | <a  href="?by=O">O</a> | <a  href="?by=P">P</a>| <a  href="?by=Q">Q</a> | <a  href="?by=R">R</a> |<a  href="?by=S">S</a> | <a  href="?by=T">T</a> | <a  href="?by=U">U</a>| <a  href="?by=V">V</a> | <a  href="?by=W">W</a> |<a  href="?by=X">X</a> | <a  href="?by=Y">Y</a> | <a  href="?by=Z">Z</a>| <a  href="?by=Æ">Æ</a> | <a  href="?by=Ø">Ø</a> |<a  href="?by=Å">Å</a> 
</p>



</body>
</html>


<?php

if(isset($_GET['by'])){
$letter=$_GET['by'];
//connect  to the database
$db=mysql_connect  ("localhost", "+++",  "+++") or die ('I cannot connect to the database  because: ' . mysql_error());
//-select  the database to use
$mydb=mysql_select_db("k");
//-query  the database table
$sql="SELECT  * FROM fa WHERE latinsk LIKE '$letter%'";
//-run  the query against the mysql query function
$result=mysql_query($sql);
//-count  results
$numrows=mysql_num_rows($result);
echo  "</p>";
//-create  while loop and loop through result set
while($row=mysql_fetch_array($result)){
$latinsk  =$row['latinsk'];
$ID  =$row['id'];            
//-display  the result of the array
echo  "<ul>\n";
echo  "<li>" . "<p style='font-family:verdana;font-size:150%;'><a href=\"search.php?id=$ID&latinsk=$latinsk\"> "   .$latinsk . " </a></li>\n</p>";
echo  "</ul>";
}
}

?>

 

This is the link I want to go to the top when clicked

<a href=\"search.php?id=$ID&latinsk=$latinsk\"> "  .$latinsk . " </a>

Link to comment
Share on other sites

How do I get the page to go to the top when the link is clicked?

 

You'll want to make use of an anchor. Give something at the top of your page an ID, top_of_page for instance, then do something like:

<a href="#top_of_page">go to top</a>

Link to comment
Share on other sites

I've tried that but it doesn't seem to work. I think it's because it's to different pages? I made an anchor on the index.php page like this <a name="start"></a>

and on the ord.php page I made the link like this <a  href=\"search.php?id=$ID&latinsk=$latinsk#start\" > "  .$latinsk . " </a>

Link to comment
Share on other sites

I think the hash needs to come before the query string

 

href="search.php#start?ID=blah blah blah"

 

Also, I think some browsers use the anchor's ID rather than name, so make them both the same

 

<A id="start" name="start"></A>

 

However, I don't see the problem.  It has been my experience that pages always display from the top when you click on a link that goes to a new page (unless the page intentionally scrolls itself using javascript or something). Why do you think you need to tell it to go to the top of this page?

Link to comment
Share on other sites

None of this seems to work. I  think I need to tell it to go to the top of the page, because when clicking on a link at the bottom of the page it doesn't go to the top of page, but just stays at the same point, so the user has to scroll up to see the content. Maybe it's because of the javascript on the index page?

Link to comment
Share on other sites

If you are going to a spot on the same page (not loading a new page) you ONLY need the hash. You do not need the filename or the query string

 

<A href="#start">Top</A>

 

Also, be sure to use both the ID and the NAME in the destination anchor, I had trouble with one browser wanting the ID and other browsers wanting the NAME. I'm not sure what the standard says.

 

<A id="start" name="start"></A>

 

Be aware that ID must be unique on the page.

 

Also, this anchor is NOT visible, but is placed at the top of the window, so it should appear immediately above or before the first thing you want to be visible:

 

<!-- RIGHT WAY -->
<A id="start" name="start"></A>
<H1>This is the Top</H1>

<!-- WRONG WAY -->
<H1>This is the Top</H1>
<A id="start" name="start"></A>

Link to comment
Share on other sites

Yes.

 

I have not played with IFRAME much, and only on FireFox when I did. So, I'm no expert. However, my experience leads me to believe that an IFRAME is treated as if it were a separate browser window. Any link you click in the IFRAME loads in that IFRAME. So, I don't see any way, other than javascript, to affect the "parent" window.  And I'm not sure what the DOM relationship is (if any) or if it is cross-browser friendly.

 

Maybe someone with some IFRAME experience can help

Link to comment
Share on other sites

This thread is more than a year old. Please don't revive it unless you have something important to add.

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Restore formatting

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.