Solved

Speeding up scrolling to bookmark

Posted on 2008-09-29
5
134 Views
Last Modified: 2012-05-05
Hello,

We have a framed page. In the main page, there is a list of categories.

If you click on a category, a request is to made to the server, and the frame then contains the list of categories, and the subcategories for the category clicked on. The link also includes a #bookmark so that it can jump down to the category selected.

The problem is, there is a brief delay where you see the heading of the frame before it gets down to the bookmark. It just looks jumpy.

Is there a way one can speed that up?

The syntax looks like:

<a href="?F=1&cid=1#1" target="main" >

Thanks in advance,

Steve
0
Comment
Question by:skbohler
  • 2
  • 2
5 Comments
 
LVL 5

Expert Comment

by:mverschoof
ID: 22597120
I don't think this is possible. The page first loads and then jumps to the position. This is how the browser works.

And a small tip. Don't use frames. It's disapproved by almost everybody, including w3c. With CSS positioning and 3 div's you don't even need it.
0
 

Author Comment

by:skbohler
ID: 22597225
Thanks.

It's an old framework that would require a ton of work to remove them.
0
 
LVL 44

Expert Comment

by:scrathcyboy
ID: 22600022
"If you click on a category, a request is to made to the server, and the frame then contains the list of categories, and the subcategories for the category clicked on. "

That is where your delay is -- a server request.  Why do you need to do this on the server?  Why can't you put the lists for each page going into a frame within that page, with accompanying javascript to go to it.

Or else, just have the links for each page include the bookmark --

A href = "thispage.html#bookmark"

Although frames are old coding now, you don't have to redo the whole page to get this faster, unless I am missing something.
0
 

Author Comment

by:skbohler
ID: 22600076
We could download the subcategories and hide them with div. But, if you then click on a subcategory and click on the back button, it doesn't remember the div state (showing instead of hiding, that is).

Or am I misunderstanding you?

Can you elaborate on what you mean by "have the links for each page include the bookmark"?

Steve
0
 
LVL 44

Accepted Solution

by:
scrathcyboy earned 250 total points
ID: 22600285
"click on the back button, it doesn't remember the div state "

Clicking the back button is an entirely different issue.  In IE, the history only includes separate pages, it does not consider going from index.html to index.html#bookmark1 to be a different page, it is the SAME page, just a different position.  So in most cases IE won't show a series of in-page anchors in the back history.

In each HTML page that is going into a frame, are the links in that page (as well as anchors) to where if someone clicks on a link (top contents list) the page itself jumps to this in-page anchor.  If you can answer that, we can go from there.  But if the table of contents links is NOT in the HTML page, but has to be delivered from the server FIRST, before the frame shows it -- then you won't get rid of the delay.
0

Featured Post

Is Your Active Directory as Secure as You Think?

More than 75% of all records are compromised because of the loss or theft of a privileged credential. Experts have been exploring Active Directory infrastructure to identify key threats and establish best practices for keeping data safe. Attend this month’s webinar to learn more.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Suggested Solutions

Title # Comments Views Activity
[HTML] Graphic not centered on page 4 46
Split in Javascript 5 31
Could you point a way to form a view's combo based on Codeigniter's results? 4 20
Bad <form> statement? 9 26
This article describes how to create custom column layout styles for Bootstrap. The article uses 5 columns to illustrate the concept, but the principle can be extended to any number of columns.
This article demonstrates how to create a simple responsive confirmation dialog with Ok and Cancel buttons using HTML, CSS, jQuery and Promises
In this tutorial viewers will learn how add a scalable full-width header using CSS3. Create a new HTML document with an internal stylesheet. Set a tiled background.:  Create a new div and name it Header. Position it with position:absolute at the top…
The viewer will receive an overview of the basics of CSS showing inline styles. In the head tags set up your style tags: (CODE) Reference the nav tag and set your properties.: (CODE) Set the reference for the UL element and styles for it to ensu…

895 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question

Need Help in Real-Time?

Connect with top rated Experts

16 Experts available now in Live!

Get 1:1 Help Now