Dylan Butler » San Diego Freelance Web Development and Consultation » yahoo

Simple drop-downs using YAHOO.util.Dom.isAncestor

Dylan — Sat, 02 May 2009 17:03:01 +0000

The Yahoo! User Interface Library (YUI) has a bunch of very nifty little methods to make complex tasks easier. One that immediately stood out to me was isAncestor, as I can attest first-hand to the cross-browser troubles when trying to detect ancestry in the DOM. Although a very basic concept, most drop-down code often becomes bloated or restrictive. I’m not advocating the use of JavaScript drop-downs over a CSS method, but there are some added benefits of using JS to achieve this effect:

Clean markup, no need for conditional comments
The ability to animate show and hide events
Added styling opportunities, won’t break so long as the nested list structure remains in tact

Below is a simple example of how to use YUI’s isAncestor to create flyout menus with HTML and CSS.

(function() {
	function mouseover(e) {
		var menu = this.getElementsByTagName('ul')[0];
		YAHOO.util.Dom.setStyle(menu, 'display', 'block');
	};

	function mouseout(e) {
		if (!YAHOO.util.Dom.isAncestor(this, e.relatedTarget) || e.relatedTarget == document.getElementsByTagName('html')[0]) {
			var menu = this.getElementsByTagName('ul')[0];
			YAHOO.util.Dom.setStyle(menu, 'display', 'none');
		}
	};
	YAHOO.util.Event.on(YAHOO.util.Dom.get('nav').getElementsByTagName('li'), 'mouseover', mouseover);
	YAHOO.util.Event.on(YAHOO.util.Dom.get('nav').getElementsByTagName('li'), 'mouseout', mouseout);
})();

See Example »

If you need something more complex, see the YUI MenuCreator page.

Design Fast Websites

Dylan — Wed, 25 Feb 2009 07:05:10 +0000

All you designers might not agree with her, but she speaks the truth!

Nicole Sullivan: "Design Fast Websites" @ Yahoo! Video

Microsoft, Google, and Yahoo come together for global identity protection

Dylan — Tue, 28 Oct 2008 06:25:26 +0000

The three internet giants Microsoft, Yahoo, and Google are joining together by agreeing to a common set of principles concerning conducting business with nations that restrict free speech and expression. They are basically trying to protect people’s information overseas with oppressive governments. I was interested to learn that the Human Rights First and Committee to Protect Journalists and nonprofits the Center for Democracy and Technology and Business for Social Responsibility took part in the formation of this humbly crafted entity known as the Global Network Initiative. What I found troubling was the lack of specific implications and obligations pertaining to these companies. Some other points of interest are the restrictions on citizenship and how that plays into this decision making. I would also like to hear the CCIPS chime in.

At least one human rights organization that didn’t sign onto the plan said it doesn’t go far enough. “More serious questions have to be asked about these company’s legal obligations,” said Morton Sklar, executive director of the World Organization for Human Rights USA. For instance, he said he would have liked the document to address whether Internet companies are violating U.S. or international laws by complying with requests from certain governments.