DHTML Lab - dhtmlab.com - Dynamic Headline Fader, Version 3.0 | 16 | WebReference

DHTML Lab - dhtmlab.com - Dynamic Headline Fader, Version 3.0 | 16

Logo

Dynamic Headline Fader, Version 3.0
NS 4.01 or older quirk


The Problem

The three earliest versions of Navigator 4 have a problem with direct assignment of a function to an event handler. They will not accept it if this assignment is done inside a function.

That is, this syntax is acceptable:

<SCRIPT>
    elementReference.onmouseover =
         function(){alert("Hey, I'm over!")}
</SCRIPT>

This syntax is not acceptable:

<SCRIPT>
    function setItUp() {
        elementReference.onmouseover =
             function(){alert("Hey, I'm over!")}
    }
	
    setItUp();
</SCRIPT>

These old versions do accept indirect assignment of a function to a handler whereever it may occur. This syntax is accepted:

<SCRIPT>
    function jumpup() {
        alert("Hey, I'm over!")
    }
    elementReference.onmouseover = jumpup;
</SCRIPT>

And so is this:

<SCRIPT>
    function jumpup() {
        alert("Hey, I'm over!")
    }
    function setItUp() {
        elementReference.onmouseover = jumpup;
    }
	
    setItUp();
</SCRIPT>

The browsers do not generate a syntax error, because there is nothing wrong with the syntax. They just don't implement it. NS for Windows may crash if the event is fired.

In the Fader script, there are three instances of direct assignment of a function in the Navgator-accessible code.

The Solution

The first two instances are in FDRinit():

.
.
.
elFader.onmouseover = function(){
    FDRisOver = true;
}
elFader.onmouseout = function(){
    FDRisOver = false;
    status = "";
}
.
.
.

Since these are not important handlers, we'll simply make the old browsers skip them:

.
.
.
if (!NSpre401) {
    elFader.onmouseover = function(){
        FDRisOver = true;
    }
    elFader.onmouseout = function(){
        FDRisOver = false;
        status = "";
    }
}
.
.
.

The third instance, however, is important, as it assigns the function to the ondblclick handler:

function FDRend(){
   clearInterval(blendTimer);
   blendTimer = null;
   if (FDRendWithFirst) {
      newsCount = 0;
      FDRfade();
   }
   if (FDRreplayOnClick) {
      startIndex = FDRendWithFirst ? (FDRhdlineCount * 2) : 0;
      if (IE4) {
         elFader.title = "Double click to replay";
         elFader.ondblclick = function(){
            this.ondblclick = null;
            this.title = "";
            FDRstart(startIndex);
         }
      }
      else {
         elFader.captureEvents(Event.DBLCLICK);

         elFader.ondblclick = function(){
            elFader.releaseEvents(Event.DBLCLICK);
            FDRstart(startIndex);
            return false;
         }
      }
    }
}

We'll have to create a new, separate, function and indirectly assign it to the event handler:

function FDRdblClickNS(){
   elFader.releaseEvents(Event.DBLCLICK);
   FDRstart(startIndex);
   return false;
}
function FDRend(){
   clearInterval(blendTimer);
   blendTimer = null;
   if (FDRendWithFirst) {
      newsCount = 0;
      FDRfade();
   }
   if (FDRreplayOnClick) {
      startIndex = FDRendWithFirst ? (FDRhdlineCount * 2) : 0;
      if (IE4) {
         elFader.title = "Double click to replay";
         elFader.ondblclick = function(){
            this.ondblclick = null;
            this.title = "";
            FDRstart(startIndex);
         }
      }
      else {
         elFader.captureEvents(Event.DBLCLICK);

         elFader.ondblclick = FDRdblClickNS;
      }
    }
}

That's all the fader.js changes for this version. But we still have a final modification for the in-page script.


Produced by Peter Belesis and

All Rights Reserved. Legal Notices.
Created: Nov 30, 1999
Revised: Nov 30, 1999

URL: http://www.webreference.com/dhtml/column27/fade3ns401funct.html