Display same-page linked item on top - How to?

R

Richard

Hi All,

I've got a simple page at http://home.comcast.net/~CaptQueeg/_Mian.html.
It's got an Aptana section at the bottom which is the target of a link
near the top of the page.

When the Aptana link is clicked, I'd like the page to display the
Aptana section at the very top. How can I do that with simple HTML?

Thanks in Advance,
Richard
 
M

mbstevens

Richard said:
Hi All,

I've got a simple page at http://home.comcast.net/~CaptQueeg/_Mian.html.
It's got an Aptana section at the bottom which is the target of a link
near the top of the page.

When the Aptana link is clicked, I'd like the page to display the
Aptana section at the very top. How can I do that with simple HTML?

Thanks in Advance,
Richard
Click to expand...
You could write a second page with the 'Aptana' information in any position
you want it to be in. I don't think the load time would be a problem for
pages like you're using.
 
B

Beauregard T. Shagnasty

Richard said:
I've got a simple page at http://home.comcast.net/~CaptQueeg/_Mian.html.
It's got an Aptana section at the bottom which is the target of a link
near the top of the page.
Click to expand...

...which doesn't work as written. You may have better luck if you use:

When the Aptana link is clicked, I'd like the page to display the
Aptana section at the very top. How can I do that with simple HTML?
Click to expand...

Simple? Since the Aptana is at the bottom, the page will jump to the
anchor "name" when the link is clicked. If there was more content below
it, it may end up at the top of a browser window.

If you are implying you want it to be *first* at the top of a page, you
will either need to write some scripting to rearrange the whole page, or
as suggested, another page with only that content.

What is the reason you want to do this?
 
R

Richard

Hi All,

I've got a simple page athttp://home.comcast.net/~CaptQueeg/_Mian.html.
It's got an Aptana section at the bottom which is the target of a link
near the top of the page.

When the Aptana link is clicked, I'd like the page to display the
Aptana section at the very top. How can I do that with simple HTML?

Thanks in Advance,
Richard
Click to expand...

Hi,

I discovered some of the problem: The W3C Markup Validator flagged
two errors, both caused by my code conflicting with the DTD I
specified. The Validator said:

<quote>
Line 14, Column 11: there is no attribute "NAME".

<h2 name="_Dummy1">_Dummy1</h2>

You have used the attribute named above in your document, but the
document type you are using does not support that attribute for this
element. This error is often caused by incorrect use of the "Strict"
document type with a document that uses frames (e.g. you must use the
"Transitional" document type to get the "target" attribute)
</quote>

The DTD I had used was:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">


I found the Transitional DTD at http://www.w3.org/TR/html401/loose.dtd,
which I am now using:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">

The validator still gives me:
<quote>
Line 14, Column 11: there is no attribute "NAME".
</quote>

But I got this "name" attribute from http://www.w3schools.com/html/html_links.asp,
where it claims:
<quote>
<a name="tips">Useful Tips Section</a>

You should notice that a named anchor is not displayed in a special
way.

To link directly to the "tips" section, add a # sign and the name of
the anchor to the end of a URL, like this:
<quote>
<a href="http://www.w3schools.com/html_links.asp#tips">Jump to the
Useful Tips Section</a>
[snip]
<a href="#tips">Jump to the Useful Tips Section</a>
</quote>

Is this W3Schools stuff outdated? Any other suggestions?

Thanks in Advance,
Richard
 
J

Jonathan N. Little

Richard said:
I discovered some of the problem: The W3C Markup Validator flagged
two errors, both caused by my code conflicting with the DTD I
specified. The Validator said:

<quote>
Line 14, Column 11: there is no attribute "NAME".

<h2 name="_Dummy1">_Dummy1</h2>
Click to expand...

That is correct you want the parameter ID not NAME

<h2 id="_Dummy1">_Dummy1</h2>


then a link said:
You have used the attribute named above in your document, but the
document type you are using does not support that attribute for this
element. This error is often caused by incorrect use of the "Strict"
document type with a document that uses frames (e.g. you must use the
"Transitional" document type to get the "target" attribute)
</quote>

The DTD I had used was:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">


I found the Transitional DTD at http://www.w3.org/TR/html401/loose.dtd,
which I am now using:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
Click to expand...

Bad idea, this is an new page you should fix the error, not *down-grade*
the doctype.

The validator still gives me:
<quote>
Line 14, Column 11: there is no attribute "NAME".
</quote>

But I got this "name" attribute from http://www.w3schools.com/html/html_links.asp,
where it claims:
<quote>
<a name="tips">Useful Tips Section</a>

You should notice that a named anchor is not displayed in a special
way.

To link directly to the "tips" section, add a # sign and the name of
the anchor to the end of a URL, like this:
<quote>
<a href="http://www.w3schools.com/html_links.asp#tips">Jump to the
Useful Tips Section</a>
[snip]
<a href="#tips">Jump to the Useful Tips Section</a>
</quote>

Is this W3Schools stuff outdated? Any other suggestions?
Click to expand...

W3Schools site is notoriously full of incorrect information. Too bad
many are fooled into think that have some affiliation or legitimacy
because of the "W3" in their domain name. I have found www.htmldog.com
information bay far more accurate.
 
B

Beauregard T. Shagnasty

Richard said:
I discovered some of the problem: The W3C Markup Validator flagged
two errors, both caused by my code conflicting with the DTD I
specified. The Validator said:

<quote>
Line 14, Column 11: there is no attribute "NAME".

<h2 name="_Dummy1">_Dummy1</h2>
Click to expand...

...which is correct.
The DTD I had used was:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
Click to expand...

...which you should use for new pages...
I found the Transitional DTD at http://www.w3.org/TR/html401/loose.dtd,
which I am now using:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
Click to expand...

...and shouldn't, as you are not Transitioning from an old legacy page.
The validator still gives me:
<quote>
Line 14, Column 11: there is no attribute "NAME".
</quote>
Click to expand...

...which is correct said:
But I got this "name" attribute from http://www.w3schools.com/html/html_links.asp,
where it claims:
<quote>
<a name="tips">Useful Tips Section</a>
Click to expand...

Note that the name attribute is used on an anchor, not a heading.
To link directly to the "tips" section, add a # sign and the name of
the anchor to the end of a URL, like this:
<quote>
<a href="http://www.w3schools.com/html_links.asp#tips">Jump to the
Useful Tips Section</a>
[snip]
<a href="#tips">Jump to the Useful Tips Section</a>
</quote>

Is this W3Schools stuff outdated?
Click to expand...

While some parts of W3Schools are misleading and erroneous, they seem to
be correct in this instance.
Any other suggestions?
Click to expand...

See my other post.
 
R

Richard

Hi Jonathan,
That is correct you want the parameter ID not NAME

<h2 id="_Dummy1">_Dummy1</h2>

then a link <a href="#_Dummy1">To _Dummy1</a> would work...
Click to expand...

Thanks, Jonathan. I "knew" I had done this before, but I couldn't
remember how. And it was so long ago, I don't know if I even have
that old code anywhere.
Bad idea, this is an new page you should fix the error, not *down-grade*
the doctype.
Click to expand...

Point taken.
But I got this "name" attribute fromhttp://www.w3schools.com/html/html_links.asp, [snip]
Is this W3Schools stuff outdated? Any other suggestions?
Click to expand...

W3Schools site is notoriously full of incorrect information. Too bad
many are fooled into think that have some affiliation or legitimacy
because of the "W3" in their domain name. I have found www.htmldog.com
information bay far more accurate.
Click to expand...

Wow! That's incredible. Is there any point if trying to inform the
W3Schools' webmaster about errors as a service to the community?

Finally, I also found a kludge for my other wish: I want to force
every select section to be "scrolled" to the top automatically. This
doesn't happen for small sections near the bottom or if the view
window is made smaller. Is there a better way. I seem to remember
some "_top" attribute.

See it all at http://home.comcast.net/~CaptQueeg/_Mian.html :)

Best wishes,
Richard
 
R

Richard

Richard said:
I discovered some of the problem: The W3C Markup Validator flagged
two errors, both caused by my code conflicting with the DTD I
specified. The Validator said:
Click to expand...
<quote>
Line 14, Column 11: there is no attribute "NAME".
Click to expand...
<h2 name="_Dummy1">_Dummy1</h2>
Click to expand...

..which is correct.
The DTD I had used was:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
Click to expand...

..which you should use for new pages...
I found the Transitional DTD athttp://www.w3.org/TR/html401/loose.dtd,
which I am now using:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
Click to expand...

..and shouldn't, as you are not Transitioning from an old legacy page.
The validator still gives me:
<quote>
Line 14, Column 11: there is no attribute "NAME".
</quote>
Click to expand...

..which is correct said:
But I got this "name" attribute fromhttp://www.w3schools.com/html/html_links.asp,
where it claims:
<quote>
<a name="tips">Useful Tips Section</a>
Click to expand...

Note that the name attribute is used on an anchor, not a heading.
To link directly to the "tips" section, add a # sign and the name of
the anchor to the end of a URL, like this:
<quote>
<a href="http://www.w3schools.com/html_links.asp#tips">Jump to the
Useful Tips Section</a>
[snip]
<a href="#tips">Jump to the Useful Tips Section</a>
</quote>
Click to expand...
Is this W3Schools stuff outdated?
Click to expand...

While some parts of W3Schools are misleading and erroneous, they seem to
be correct in this instance.
Any other suggestions?
Click to expand...

See my other post.
Click to expand...

Hi Beauregard,

I posted a reply to your first response, buy it appears to have
gotten lost in the aether, notwithstanding Michelson and Morley's
apparent proof that there is no "ether" :)

No matter. That's been overtaken by events, i.e. please see my
response to Jonathan and take a peek at my latest version at
http://home.comcast.net/~CaptQueeg/_Mian.html.

As usual, thanks again for aiding me in my HTML-CSS education.

Best wishes,
Richard
 
B

Beauregard T. Shagnasty

Richard said:
No matter. That's been overtaken by events, i.e. please see my
response to Jonathan and take a peek at my latest version at
http://home.comcast.net/~CaptQueeg/_Mian.html.
Click to expand...

Ok, that'll work. <g>

You wouldn't want to use that "dummy section" on a production page,
though. There isn't any good way to do what you want, other than to make
sure you have enough content to keep the anchor/id at the top of the
viewport. And testing it at various browser widths, too, including very
wide ones.

I've never noticed user problems if the anchor spot wasn't right at the
top. They seem to find it...
 
R

Richard

Hi Beauregard,
Ok, that'll work. <g>
Click to expand...

Yeah, thankfully. I love that technique. Presently I save my notes
as .doc files in a hierarchy of subject directories. There's lots
wrong with that, but I wasn't willing to spend time/energy/money on
coming up with a better way ... until now, when I'm starting to "feel
my oats" with HTML-CSS-JavaScript in my new software-developer
incarnation.

BTW, my history is Visual C++/MFC/COM on Windows; C on VAX/VMS; DG
and Eclipse with Basic; micros with CP/M and C; IBM Mainframes with
PL/1, Cobol, Fortran, ASM; IBM 1620 with Fortran, Assembler.

There's still going to be annoying bookkeeping to synchronize the
links and the content, but I'm already planning two things:

1. a Ruby script to take a newly modified "Notes.html", backup the
modified file, strip its "menu" of links, regenerate the links based
on text in <h2> tags, paste the new links in the new file.

2. Through in some Ruby on Rails and Ajax so that only top-level links
are shown and subordinate links to <h3> links are shown for for the
current link and the <h3> links are closed when a new <h2> link is
selected.

I don't know how it'll all work out, if ever, but I'll have fun.
You wouldn't want to use that "dummy section" on a production page,
though. There isn't any good way to do what you want, other than to make
sure you have enough content to keep the anchor/id at the top of the
viewport. And testing it at various browser widths, too, including very
wide ones.
Click to expand...

Presently, I'm only concerned out my own "Notebook". Nevertheless,
I don't think my hack will be a problem if I publish such a thing. If
I do publish and find a problem, I'll resort to scripting,
I've never noticed user problems if the anchor spot wasn't right at the
top. They seem to find it...
Click to expand...

I was the counter-example. I clicked on my link (after the code was
corrected, but without my hack) and saw nothing change. I leaped to
the conclusion that there was something wrong with my code. Of course
I eventually realized that browsers don't operate the way they should
IMHO.

Again, my thanks, Beauregard, for "tuning in". I very much
appreciate your insights.

Best wishes,
Richard
 
B

Bergamot

Beauregard said:
You may have better luck if you use:

<h2><a name="Aptana">Aptana</a></h2>
Click to expand...

Why is that better than <h2 id="Aptana">?

The only browser I know of that doesn't support using id as an anchor is
Netscape 4.x. Or is there another similarly broken browser out there?
 
C

Chris F.A. Johnson

But I got this "name" attribute from http://www.w3schools.com/html/html_links.asp,
where it claims:
<quote>
<a name="tips">Useful Tips Section</a>

You should notice that a named anchor is not displayed in a special
way.

To link directly to the "tips" section, add a # sign and the name of
the anchor to the end of a URL, like this:
<quote>
<a href="http://www.w3schools.com/html_links.asp#tips">Jump to the
Useful Tips Section</a>
[snip]
<a href="#tips">Jump to the Useful Tips Section</a>
</quote>

Is this W3Schools stuff outdated? Any other suggestions?
Click to expand...

No, but you need to read it more carefully (or maybe they need to
explain it clearly). The "name" attribute can be applied to an
acnchor, but not to a heading.

That usage is not recommended however; it is generally considered
better to use the "id" attribute instead.
 
D

dorayme

"Chris F.A. Johnson said:
That usage is not recommended however; it is generally considered
better to use the "id" attribute instead.
Click to expand...

One reason it is better is that it is simpler to use/type.
Another is to avoid having to code to avoid hover effects on
"named anchors" which are really not appropriate. These hover
effects and other effects can easily creep in from the css sheet
which generally specifies anchors. You will find id_ing much
cleaner and simpler to use for the purpose.
 
R

Richard

But I got this "name" attribute fromhttp://www.w3schools.com/html/html_links.asp,
where it claims:
<quote>
<a name="tips">Useful Tips Section</a>
Click to expand...
You should notice that a named anchor is not displayed in a special
way.
Click to expand...
To link directly to the "tips" section, add a # sign and the name of
the anchor to the end of a URL, like this:
<quote>
<a href="http://www.w3schools.com/html_links.asp#tips">Jump to the
Useful Tips Section</a>
[snip]
<a href="#tips">Jump to the Useful Tips Section</a>
</quote>
Click to expand...
Is this W3Schools stuff outdated? Any other suggestions?
Click to expand...

No, but you need to read it more carefully (or maybe they need to
explain it clearly). The "name" attribute can be applied to an
acnchor, but not to a heading.

That usage is not recommended however; it is generally considered
better to use the "id" attribute instead.

--
Chris F.A. Johnson <http://cfaj.freeshell.org>
===================================================================
Author:
Shell Scripting Recipes: A Problem-Solution Approach (2005, Apress)
Click to expand...

Hi Chris,
No ...
Click to expand...

I'm glad to know that because I've visited the site a lot and
benefited a lot from it.
... but you need to read it more carefully (or maybe they need to
explain it clearly). The "name" attribute can be applied to an
acnchor, but not to a heading.
Click to expand...

I noticed that it was applied to an anchor, but didn't notice
anything suggesting that other tags couldn't use the "name"
attribute. If I hadn't used this referencing approach before (with
"id", apparently, but I couldn't remember the attribute), I might not
have presumed it would apply to other tags. But all's well that ends
well ... that's my motto.

That usage is not recommended however; it is generally considered
better to use the "id" attribute instead.
Click to expand...

Great!

Best wishes,
Richard
 
R

Richard

One reason it is better is that it is simpler to use/type.
Another is to avoid having to code to avoid hover effects on
"named anchors" which are really not appropriate. These hover
effects and other effects can easily creep in from the css sheet
which generally specifies anchors. You will find id_ing much
cleaner and simpler to use for the purpose.
Click to expand...

Hi dorayme,

Interesting -- nice to know.

Best wishes,
Richard
 
J

Jukka K. Korpela

Scripsit Bergamot:
Why is that better than <h2 id="Aptana">?

The only browser I know of that doesn't support using id as an anchor
is Netscape 4.x. Or is there another similarly broken browser out
there?
Click to expand...

Perhaps there is. Other reasons that might make people use the old construct
include:

1) They have some utility that assumes such anchors. (I do. I'm ashamed but
I won't touch my Perl code - Perl is, after all, a write-only language -
just to fix that.) Generally not relevant at all, but if relevant, it can be
very relevant.

2) They use authoring software that creates such links. There's usually no
reason to hand-edit them. I suppose there is such software.

3) They want to use an anchor name that does not conform to ID syntax. Beats
me why, but such anchors _are_ used.

4) They intend to style the heading in a manner that requires its content to
be wrapped in an inline container (a fairly common trick). Rather than using
<span>, why not use <a>?

So no good reason really, as a rule.
 
B

Bergamot

Jukka said:
Other reasons that might make people use the old construct
include:

1) They have some utility that assumes such anchors. (I do. I'm ashamed but
I won't touch my Perl code
Click to expand...

Tsk tsk. Sounds like a personal problem to me. ;)
 

Ask a Question

Want to reply to this thread or ask your own question?

You'll need to choose a username for the site, which only take a couple of moments. After that, you can post your question and our members will help you out.

Ask a Question

Similar Threads

Top NOT top? 2
How to position the *tooltip* comment on these buttons? 9
How to stop an animated image from sticking to top of page? 2
How to use PDF-lib and how to center each line of texts on the page? 1
position page fragment (anchor) on top of page. 1
How do I call the exact function on page load? 6
How can I get my menu inside of a menu to function properly? 1
How can I view / open / render / display a pdf file with c code? 0

Members online

No members online now.
Total: 32 (members: 0, guests: 32)
Robots: 456

Forum statistics

Threads
473,769
Messages
2,569,580
Members
45,055
Latest member
SlimSparkKetoACVReview

Latest Threads

Top