...

View Full Version : changing cursors with frames



KingdomTubes
01-22-2012, 09:08 PM
Hello, I'd need some help for scripting.
Here is what I need to do.

I got links in frameA which open pages in frameB.
Pages might be long to load, so when I click on the link, from frameA, I want to have the "wait" cursor until body of frameB loads, then return to "default" cursor in frameA.

I'd also want the cursor to be on "wait" in all my 4 frames during the load if possible.

I can't do it with a:active in CSS cause the cursor is stuck on "wait" when it's clicked even after page in frameB is loaded.

I searched hours in forums, tried lots of things and didn't fix my problem.

Would need help, thanks :o

KingdomTubes
01-23-2012, 11:56 AM
bump, pls ;)

Arbitrator
01-23-2012, 12:40 PM
Try this:

document.xhtml:

<?xml version="1.0" encoding="UTF-8"?>
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en-US">
<head>
<title>Demo Document</title>
<style>
/* Basic Layout */
* { margin: 0; }
html { padding: 2em; }
p, div { margin: 1em; }
iframe { width: 100%; height: 300px; }
</style>
<script>
// <![CDATA[
var a_element = null;
var iframe_element = null;
function cursor_wait() {
document.documentElement.style.setProperty("cursor", "progress", null);
document.defaultView.alert("|cursor_wait| RUN SUCCESSFULLY!");
}
function cursor_reset() {
document.documentElement.style.removeProperty("cursor");
document.defaultView.alert("|cursor_reset| RUN SUCCESSFULLY!");
}
function initialize_scripts() {
a_element = document.getElementById("link");
iframe_element = document.getElementById("frame");
a_element.addEventListener("click", cursor_wait, false);
iframe_element.addEventListener("load", cursor_reset, false);
document.defaultView.alert("|initialize_scripts| RUN SUCCESSFULLY!");
}
document.defaultView.addEventListener("load", initialize_scripts, false);
// ]]>
</script>
</head>
<body>
<p><a id="link" href="http://www.whatwg.org/specs/web-apps/current-work/" target="frame">Click me to load a page in the inline frame.</a></p>
<div><iframe id="frame" name="frame" src="http://www.example.org/"/></div>
</body>
</html>

KingdomTubes
01-23-2012, 11:33 PM
Try this:

document.xhtml:

<?xml version="1.0" encoding="UTF-8"?>
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en-US">
<head>
<title>Demo Document</title>
<style>
/* Basic Layout */
* { margin: 0; }
html { padding: 2em; }
p, div { margin: 1em; }
iframe { width: 100%; height: 300px; }
</style>
<script>
// <![CDATA[
var a_element = null;
var iframe_element = null;
function cursor_wait() {
document.documentElement.style.setProperty("cursor", "progress", null);
document.defaultView.alert("|cursor_wait| RUN SUCCESSFULLY!");
}
function cursor_reset() {
document.documentElement.style.removeProperty("cursor");
document.defaultView.alert("|cursor_reset| RUN SUCCESSFULLY!");
}
function initialize_scripts() {
a_element = document.getElementById("link");
iframe_element = document.getElementById("frame");
a_element.addEventListener("click", cursor_wait, false);
iframe_element.addEventListener("load", cursor_reset, false);
document.defaultView.alert("|initialize_scripts| RUN SUCCESSFULLY!");
}
document.defaultView.addEventListener("load", initialize_scripts, false);
// ]]>
</script>
</head>
<body>
<p><a id="link" href="http://www.whatwg.org/specs/web-apps/current-work/" target="frame">Click me to load a page in the inline frame.</a></p>
<div><iframe id="frame" name="frame" src="http://www.example.org/"/></div>
</body>
</html>

Thanks a lot for taking your time on this, my problem is fixed now :):)



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum