Q72 How can I prevent the links from working until all the images have loaded?

irt.org | Knowledge Base | JavaScript | Image | Q72 [ previous next ]

Q72 How can I prevent the links from working until all the images have loaded?

At the top of the document:

<html><head>
<script language="JavaScript"><!--
var loaded = false;

function checkFirst(href) {
    if (loaded)
        self.location.href = href;
    else
        alert("The pretty piccys haven't loaded yet");
}
//--></script>
</head>
<body onLoad="loaded = true;">

Each and every one of the links will need to be rewritten to invoke a JavaScript function, e.g. if the existing link looks like this:

<a href="http://www.yahoo.com/">Yahoo</a>

Then it will have to rewritten as:

<a href="javascript:checkFirst('http://www.yahoo.com/')">Yahoo</a>

This may still, however, interrupt the page if it is still loading. In which case you might want to try the following version instead:

<html><head>
<script language="JavaScript"><!--
var loaded = false;

function checkFirst(href) {
    if (loaded)
        return true;
    else {
        alert("The pretty piccys haven't loaded yet");
        return false;
    }
}
//--></script>
</head>
<body onLoad="loaded = true;">

Then all the links will have to rewritten as:

<a href="http://www.yahoo.com/" onClick="return checkfirst()">Yahoo</a>

Feedback on 'Q72 How can I prevent the links from working until all the images have loaded?'

16:16:24 7/20/00 Adoram Rogel

What's New

How to do the impossible with Google Gears

Out and About

Last Updated: 30th March 2008. Maintained by: Martin Webb and Michel Plungjan
irt.org liability, trademark, document use, privacy statement and software licensing rules apply.