Webpage does not resume lhtml loading if JS operates.

[JS]

Dear Group,
I have a webpage of small images. At the bottom is a Javascript
function. If someone scrolls impatiently to the function link, when
the action is complete the html does not continue loading the images.
How is this situation best dealt with?
Thank you for any assistance you can offer.
JS

[Michael Winter]

On Sun, 10 Oct 2004 12:46:42 GMT, <[e-mail]> wrote:

I have a webpage of small images. At the bottom is a Javascript
function. If someone scrolls impatiently to the function link, when the
action is complete the html does not continue loading the images.
How is this situation best dealt with?
Thank you for any assistance you can offer.

By "function link", do you mean

<a href="javascript:funcName()">...</a>

If so, please read the FAQ (<URL:http://jibbering.com/faq/>). If not,
please provide a better description, preferably illustrated with a small
snippet of code.

Mike

--
Michael Winter
Replace ".invalid" with ".uk" to reply by e-mail.

[JS]

On Sun, 10 Oct 2004 12:56:40 GMT, "Michael Winter"
<M.******@blueyonder.co.invalid> wrote:

On Sun, 10 Oct 2004 12:46:42 GMT, <[e-mail]> wrote:

I have a webpage of small images. At the bottom is a Javascript
function. If someone scrolls impatiently to the function link, when the
action is complete the html does not continue loading the images.
How is this situation best dealt with?
Thank you for any assistance you can offer.

By "function link", do you mean

<a href="javascript:funcName()">...</a>

If so, please read the FAQ (<URL:http://jibbering.com/faq/>). If not,
please provide a better description, preferably illustrated with a small
snippet of code.

Mike

--
Michael Winter
Replace ".invalid" with ".uk" to reply by e-mail.

Michael,
Thank you for the URL. I took the advice there and changed from
'javascript:some function()' to the onClick="some function" variation
with 'return false' to end. The browser returned to the image loading
successfully.
It has caused an unexpected side effect, in that the 'visited' links
no longer change color. I am using <STYLE type="text/css"> with
statements to set the font size, color, and decoration, but although
the hover works the visited no longer changes.
Is there a solution for this?
Thank you for your assistance.
JS

[Michael Winter]

On Sun, 10 Oct 2004 16:04:12 GMT, <[e-mail]> wrote:

[snip]

It has caused an unexpected side effect, in that the 'visited' links no
longer change color. I am using <STYLE type="text/css"> with statements
to set the font size, color, and decoration, but although the hover
works the visited no longer changes.
Is there a solution for this?

I can probably guess the cause, but it would be helpful to actually see
your code.

What is probably happening is that the URI specified by the link isn't
actually being visited as a result of user action. As such, the browser
doesn't have any reason to change the appearance of the link. A possible
solution is to add code to force the change through manipulation of inline
style information, or the class attribute of the A element. However,
without knowing what is causing the problem, it's hard to recommend
something.

Please either post a URI to an example, or post the relevant HTML and
(possibly) script code.

Mike

--
Michael Winter
Replace ".invalid" with ".uk" to reply by e-mail.

[JS]

On Sun, 10 Oct 2004 16:32:05 GMT, "Michael Winter"
<M.******@blueyonder.co.invalid> wrote:

On Sun, 10 Oct 2004 16:04:12 GMT, <[e-mail]> wrote:

[snip]

It has caused an unexpected side effect, in that the 'visited' links no
longer change color. I am using <STYLE type="text/css"> with statements
to set the font size, color, and decoration, but although the hover
works the visited no longer changes.
Is there a solution for this?

I can probably guess the cause, but it would be helpful to actually see
your code.

What is probably happening is that the URI specified by the link isn't
actually being visited as a result of user action. As such, the browser
doesn't have any reason to change the appearance of the link. A possible
solution is to add code to force the change through manipulation of inline
style information, or the class attribute of the A element. However,
without knowing what is causing the problem, it's hard to recommend
something.

Please either post a URI to an example, or post the relevant HTML and
(possibly) script code.

Mike

Mike,
Thanks for your welcome assistance.
The webpage has two IFrames, and clicking on one of many href links
fires the Javascript which loads a file into each. As I first
mentioned, the problem was that it did not return to downloading the
page images; otherwise, all OK.
Here is the BEFORE, and then AFTER the latest change scenaria.

BEFORE: <a href="javascript:change_frames('photo','text')">me </a><br>
AFTER: <a href="#" onClick="change_frames('photo','text'); return
false">me</a><br>

All other factors are unchanged. It does not matter if I use the URL
of one of the two files to be downloaded as the target of the href,
the link still does not change color on visit. The function is based
on 'inlineframe.location.href=photo+".jpg"; and similar for the text
file.
Thanks very much for your suggestions.
JS

[JS]

On Sun, 10 Oct 2004 19:01:27 GMT, [e-mail] wrote:

SNIP>

Mike,
Thanks for your welcome assistance.
The webpage has two IFrames, and clicking on one of many href links
fires the Javascript which loads a file into each. As I first
mentioned, the problem was that it did not return to downloading the
page images; otherwise, all OK.
Here is the BEFORE, and then AFTER the latest change scenaria.

BEFORE: <a href="javascript:change_frames('photo','text')">me </a><br>
AFTER: <a href="#" onClick="change_frames('photo','text'); return
false">me</a><br>

All other factors are unchanged. It does not matter if I use the URL
of one of the two files to be downloaded as the target of the href,
the link still does not change color on visit. The function is based
on 'inlineframe.location.href=photo+".jpg"; and similar for the text
file.
Thanks very much for your suggestions.
JS

Mike,
I have just discovered that the link behaviour described in BEFORE
does not change in OPERA. It is therefore IE being obliging and
presumably contrary to standards compliance.
The question seems to be, then, how does one get the link to change
after onClick?
JS

[Michael Winter]

On Sun, 10 Oct 2004 19:01:27 GMT, <[e-mail]> wrote:

[snip]

BEFORE: <a
href="javascript:change_frames('photo','text')">me </a><br>
In case you're wonder what the actual problem was with this...

As you know, when a user clicks on a link, the browser attempts to
download the resource indicated by the URI. The browser's assumption is
that the resource will completely replace the current document (unless the
URI *is* the current document, of course), so most makes quite a sensible
decision: stop doing things. "Things" can be executing scripts, rendering
animation, or downloading data (such as images) for the now outgoing page.

As mentioned in the FAQ, the javascript URI scheme was originally intended
to do what a link normally does - replace the current page - so browsers
often act the same as they would with any other URI and stop what they
deem "pointless" activities.
AFTER: <a href="#"
onClick="change_frames('photo','text'); return false">me</a><br>

The link isn't marked as visited, because it already has been visited. The
URI refers to the current page so, if anything, the link should already be
rendered as you want.

A possible solution would be to add code to the click event listener that
manipulates the class attribute of the link. For example:

/* Script */
function markVisited(elem) {
elem.className = 'visited';
}
/* CSS Rule */
a:visited,
a.visited {
/* Set the color and background-color properties */
}

<a href="#"
onclick="markVisited(this);change_frames(....);ret urn false">

This will only be a temporary effect. If the page is reloaded, the
appearance will revert to how it was originally. If you already have class
attributes set on some of the links, you'll need to modify the markVisited
function (commented so you see what's happening):

function markVisited(elem) {
/* Get the current value of the class attribute and set the
* value that we're going to add.
*/
var cN = elem.className, v = 'visited';

/* If the className property isn't a string, then quit now: we
* can't do anything. If it is, check that we haven't already
* added the new string.
*/
if(('string' == typeof cN) && (-1 == cN.indexOf(v))) {

/* If the attribute already contains values, prepend a space
* before appending the new string.
*/
if(cN) {v = ' ' + v;}

/* Modify the attribute. Notice that we're now working on the
* real thing. The local variable was just for speed.
*/
elem.className += v;
}
}

However, you'll probably find that this won't result in a change as the
link should already be visited (as I said, the URI refers to the current
page). In such a case, the solution is to first set the link appearance to
the way you want when the page loads, then change it (as above), to the
visited appearance.

/* Call from the load event:
* <body onload="markVisited()">
*/
function markUnvisited() {
var a = document.links || [];
for(var i = 0, n = a.length; i < n; ++i) {
addClassValue(a[i], 'unvisited');
}
}

/* Call as in previous example. */
function markVisited(elem) {
addClassValue(elem, 'visited');
}

function addClassValue(elem, value) {
var cN = elem.className;

if(('string' == typeof cN) && (-1 == cN.indexOf(value))) {
if(cN) {value = ' ' + value;}
elem.className += value;
}
}
/* CSS Rules */
a:link,
a.unvisited {
/* Unvisited properties. */
}

a:visited,
a.visited {
/* Visited properties. */
}

All this is untested, by the way, so tell me if you have problems.

[snip]

Good luck,
Mike

--
Michael Winter
Replace ".invalid" with ".uk" to reply by e-mail.

[JS]

On Sun, 10 Oct 2004 20:08:12 GMT, "Michael Winter"
<M.******@blueyonder.co.invalid> wrote:

On Sun, 10 Oct 2004 19:01:27 GMT, <[e-mail]> wrote:

[snip]

BEFORE: <a
href="javascript:change_frames('photo','text')">me </a><br>

In case you're wonder what the actual problem was with this...

As you know, when a user clicks on a link, the browser attempts to
download the resource indicated by the URI. The browser's assumption is
that the resource will completely replace the current document (unless the
URI *is* the current document, of course), so most makes quite a sensible
decision: stop doing things. "Things" can be executing scripts, rendering
animation, or downloading data (such as images) for the now outgoing page.

As mentioned in the FAQ, the javascript URI scheme was originally intended
to do what a link normally does - replace the current page - so browsers
often act the same as they would with any other URI and stop what they
deem "pointless" activities.

AFTER: <a href="#"
onClick="change_frames('photo','text'); return false">me</a><br>

The link isn't marked as visited, because it already has been visited. The
URI refers to the current page so, if anything, the link should already be
rendered as you want.

A possible solution would be to add code to the click event listener that
manipulates the class attribute of the link. For example:

/* Script */
function markVisited(elem) {
elem.className = 'visited';
}
/* CSS Rule */
a:visited,
a.visited {
/* Set the color and background-color properties */
}

<a href="#"
onclick="markVisited(this);change_frames(....);ret urn false">

This will only be a temporary effect. If the page is reloaded, the
appearance will revert to how it was originally. If you already have class
attributes set on some of the links, you'll need to modify the markVisited
function (commented so you see what's happening):

function markVisited(elem) {
/* Get the current value of the class attribute and set the
* value that we're going to add.
*/
var cN = elem.className, v = 'visited';

/* If the className property isn't a string, then quit now: we
* can't do anything. If it is, check that we haven't already
* added the new string.
*/
if(('string' == typeof cN) && (-1 == cN.indexOf(v))) {

/* If the attribute already contains values, prepend a space
* before appending the new string.
*/
if(cN) {v = ' ' + v;}

/* Modify the attribute. Notice that we're now working on the
* real thing. The local variable was just for speed.
*/
elem.className += v;
}
}

However, you'll probably find that this won't result in a change as the
link should already be visited (as I said, the URI refers to the current
page). In such a case, the solution is to first set the link appearance to
the way you want when the page loads, then change it (as above), to the
visited appearance.

/* Call from the load event:
* <body onload="markVisited()">
*/
function markUnvisited() {
var a = document.links || [];
for(var i = 0, n = a.length; i < n; ++i) {
addClassValue(a[i], 'unvisited');
}
}

/* Call as in previous example. */
function markVisited(elem) {
addClassValue(elem, 'visited');
}

function addClassValue(elem, value) {
var cN = elem.className;

if(('string' == typeof cN) && (-1 == cN.indexOf(value))) {
if(cN) {value = ' ' + value;}
elem.className += value;
}
}
/* CSS Rules */
a:link,
a.unvisited {
/* Unvisited properties. */
}

a:visited,
a.visited {
/* Visited properties. */
}

All this is untested, by the way, so tell me if you have problems.

[snip]

Good luck,
Mike

--
Michael Winter
Replace ".invalid" with ".uk" to reply by e-mail.

Thank you very much for your time and assistance with this Mike. It
will take me some time to develop and test it.
Regards
JS

[JS]

On Sun, 10 Oct 2004 20:08:12 GMT, "Michael Winter"
<M.******@blueyonder.co.invalid> wrote:

On Sun, 10 Oct 2004 19:01:27 GMT, <[e-mail]> wrote:

[snip]

Mike,

I had an alternative approach which should work with little effort -
but after 4 hours I have serious doubts!
The plan: Use a plain html link to load a file into the first Iframe;
this preserves the link color change.
When the file loads, use it's onLoad to load the second Iframe.

In the absence of this I can put a link <a href="photo.jpg"
target="inlinefile">click</a> and this works fine. However, to get
this to work using the onLoad seems beyond me, for the javascript does
not apparently react to the target information. I would have thought
this was an elegant (simple) solution, but it has defeated me so far.
Any thoughts?
Thanks again
JS

[Andrew Thompson]

On Sun, 10 Oct 2004 21:10:30 GMT, [e-mail] wrote:

..It will take me some time to develop and test it.

Whereas it takes only moments to extract the 130 lines
of text no longer relevant to the reply.

Please trim unnecessary text in future.
<http://www.physci.org/rfc/rfc1855.jsp#3_1_1>

--
Andrew Thompson
http://www.PhySci.org/codes/ Web & IT Help
http://www.PhySci.org/ Open-source software suite
http://www.1point1C.org/ Science & Technology
http://www.lensescapes.com/ Images that escape the mundane

[Michael Winter]

On Mon, 11 Oct 2004 09:37:09 GMT, <[e-mail]> wrote:

[snip]

When the file loads, use it's onLoad to load the second Iframe.
[snip]
However, to get this to work using the onLoad seems beyond me, for the
javascript does not apparently react to the target information.

To change the location of the second IFRAME from the first, you'd use:

parent.frames['frameName'].location = 'url';

What were you attempting to use?

[snip]

Mike

--
Michael Winter
Replace ".invalid" with ".uk" to reply by e-mail.

[JS]

On Tue, 12 Oct 2004 09:51:15 GMT, "Michael Winter"
<M.******@blueyonder.co.invalid> wrote:

[SNIP}

To change the location of the second IFRAME from the first, you'd use:

parent.frames['frameName'].location = 'url';

What were you attempting to use?

[snip]

Mike

Mike,
My completely off-track attempt will go to my grave with me! The trick
of letting html deal with the link color while the onLoad loads the
second frame was a great success - entirely due to your help.
It works beautifully, and I am indebted to you.
Thank you for your kind assistance.
JS