If you’ve to debug some script in Safari, and you’d wish to write into the javascript console, the simple advice is to use the same code as in Firefox.

console.log(object);

That’s all.

The project I’m working on finally released as Beta - www.mayomo.com

MaYoMo is a “social news network” for journalists and their readers that empowers a new era of Internet news creation and distribution. With an ever-expanding corps of citizen and independent journalists based in every corner of the globe, MaYoMo is shaping the evolution of journalism and delivering the world’s most inspired multimedia news content. Now, thanks to MaYoMo’s highly unique and entrepreneurial “news channel approach,” professional, amateur, and student journalists can create and manage their own custom news channel, unleashing new career and business opportunities based on the company’s shared revenue advertising model. MaYoMo lets you discover the power of news like never before and experience the new future of journalism and news content distribution.

Attaching Event Listeners in JavaScript

Everybody knows how different is to attach event listeners under different browsers. Under IE is attachEvent(), while under FF is addEventListener()! The compatibility can be checked in the PPK site www.quirksmode.org where the author describes in detail where a given event listener can be registered and how it should be done.

Event Bubbling

Important part of the events in JavaScript is the so called “event bubbling“. You know, when you click on a given DOM element when bubbling is on the DOM elements containing this specific DOM element receive the event. So when I move the mouse over a DIV element the event mousemove is received in every element containing that DIV up to the window object.

In Mozilla it should look like this:

element.addEventListener('mousemove', callback, false);

Where the third parameter is describing the use of event bubbling, when setup to false, and if it’s set to true the other type of event handling is used, the so called capturing, which in breaf is the oposite of bubbling and the event is propagated from the top to bottom. The problem under different browsers is that sometimes this “mousemove” is not enough. In the case of mousewheel there are several combinations.

In IE:

document.attachEvent('onmousewheel', function(e){
     if (!e) var e = window.event;
     e.returnValue = false;
     e.cancelBubble = true;
     return false;
}, false);

In Safari:

document.addEventListener('mousewheel', function(e){
    e.stopPropagation();
    e.preventDefault();
    e.cancelBubble = false;
    return false;
}, false);

In Opera:

document.attachEvent('mousewheel', function(e){
    if (!e) var e = window.event;
    e.returnValue = false;
    e.cancelBubble = true;
    return false;
}, false);

In Firefox:

document.addEventListener('DOMMouseScroll', function(e){
    e.stopPropagation();
    e.preventDefault();
    e.cancelBubble = false;
    return false;
}, false);

Note the differences between all the browsers.