0

Hi all, I've heard great things about this place, so thought I'd see if anyone had some thoughts on something that's been bugging me.

I'm creating a script which causes the page to scroll when the mouse is held down within 1/3 of the page height of the window edge. An example can be found at http://medicles.co.uk/scroll.html, and is working fine in Firefox, Safari and Chrome, but not in IE. I'm 90% certain this is due to the browser's non-handling of addEventListener, but I'm not sure how to fix this...I've tried the following so far:

if (document.addEventListener){
        document.addEventListener('mousemove', changeState, true);
        document.addEventListener('mouseout', stopScrollingIfOutsideWindow, true);
        document.addEventListener('mousedown', markMouseDown, true);
        document.addEventListener('mouseup', unmarkMouseDown, true);
} else if (document.attachEvent){
        document.attachEvent('onmousemove', changeState);
        document.attachEvent('onmouseout', stopScrollingIfOutsideWindow);
        document.attachEvent('onmousedown', markMouseDown);
        document.attachEvent('onmouseup', unmarkMouseDown);
}

The above is currently commented out, and the page is using the following code at the moment (which I found somewhere else on the net), still with no success:

//***Cross browser attach event function. For 'evt' pass a string value with the leading "on" omitted
//***e.g. AttachEvent(window,'load',MyFunctionNameWithoutParenthesis,false);

function AttachEvent(obj,evt,fnc,useCapture){
        if (!useCapture) useCapture=false;
        if (obj.addEventListener){
                obj.addEventListener(evt,fnc,useCapture);
                return true;
        } else if (obj.attachEvent) return obj.attachEvent("on"+evt,fnc);
        else{
                MyAttachEvent(obj,evt,fnc);
                obj['on'+evt]=function(){ MyFireEvent(obj,evt) };
        }
} 

//The following are for browsers like NS4 or IE5Mac which don't support either
//attachEvent or addEventListener
function MyAttachEvent(obj,evt,fnc){
        if (!obj.myEvents) obj.myEvents={};
        if (!obj.myEvents[evt]) obj.myEvents[evt]=[];
        var evts = obj.myEvents[evt];
        evts[evts.length]=fnc;
}
function MyFireEvent(obj,evt){
        if (!obj || !obj.myEvents || !obj.myEvents[evt]) return;
        var evts = obj.myEvents[evt];
        for (var i=0,len=evts.length;i<len;i++) evts[i]();
}

AttachEvent(document, 'mousemove', changeState, true);
AttachEvent(document, 'mouseout', stopScrollingIfOutsideWindow, true);
AttachEvent(document, 'mousedown', markMouseDown, true);
AttachEvent(document, 'mouseup', unmarkMouseDown, true);

I'm sure the error I'm making is fairly simple, but I'm far from being comfortable with javascript, so any help would be much appreciated!

2
Contributors
1
Reply
7
Views
8 Years
Discussion Span
Last Post by Airshow
0

cg,

Whereas in the tutorials d.attachEvent and d.addEventListener seem sacred, most of the time you can use a much simpler syntax to attach event handlers :

document.onmousemove = changeState;
document.onmouseout = stopScrollingIfOutsideWindow;
document.onmousedown = markMouseDown;
document.onmouseup = unmarkMouseDown;

This will work cross browser. The only thing it lacks is the ability to specify event bubbling, which only applies to Moz/derivitives anyway.

Airshow

This topic has been dead for over six months. Start a new discussion instead.
Have something to contribute to this discussion? Please be thoughtful, detailed and courteous, and be sure to adhere to our posting rules.