Topic awaiting preservation: August 2005 - 20-line Javascript Contest - Navigation widgets (Page 1 of 1)

I must admit I don't remember the "classic" disclaimer, but who cares?
This is your monthly, friendly compo, the topic for this month are navigation widgets.
Got an Oh-so-stylish drop-down menu? A tree? Anything else that falls into the "navigation" category,
can be packed in 20 lines of javascript code and is likely to get chicks to rip their clothes off around you?

Well, we aren't picky, so it doesn't really matter if your snippet turns ladies on, all we want is a nifty navigation widget
in 20 lines of code.

Gentlemen, start your text editor and have fun!

Hmm... and let the sexism begin or what?

No, you may rip your clothes off as well.

lol how bloody funny

Ok, crap fading drop down menus:

Seems to work ok in IE and Firefox and comes to 16 lines of code, unless I've broken any rules.

//template to build a menu out of
var Template1="<div class=\"MainMenu\" id=\"Menu[Menus]\" onmouseover=\"Show([Menus],100,0)\" onmouseout=\"Show([Menus],0,100)\" style=\"top:[y];left:[x];\">[Main]<br><div class=\"SubMenu\" id=\"Sub[Menus]\" style=\"filter:alpha(opacity=0);-moz-opacity:0;\">[SubMenus]</div></div>";					
//counter, how many menus have been created
var Menus=0;																											
//menu state
var MenuGo=new Array();																									
//sets if a menu should be shown or hidden
var Show=new Function("i,s,t","MenuGo[i]=new Array(s,(MenuGo[i]!=null)?MenuGo[i][1]:t);");								

//Main : main link or text
//Sub : array of sublinks or text
//x : x position on screen
//y : y position on screen
//template: template to use for building the menu
function CrapMenu(Main,Sub,x,y,template)
{
	//turn array of links into html list of links
	var SubMenus="&nbsp;"+Sub.toString().replace(/\,/g,"&nbsp;<br>&nbsp;");												
	//pad the menu heading 
	var Main="&nbsp;"+Main+"&nbsp;"																						

	//replace keyword in template [word] with javascript variable of same name
	while((tmp=template.match(/\[\w*\]/)) !=null)																		
		template=template.replace(tmp, eval(tmp.toString().replace("[","").replace("]","")));							
	
	//add the menu to the document
	document.body.innerHTML+=template;																					
	
	//increment counter
	Menus++;																											
}

function ShowHide()
{
	for(i=0;i<Menus;i++){																								
		//if the menu hasn't been used yet or it is fully shown/hidden skip it
		if(MenuGo[i]!=null && (MenuGo[i][0]!=MenuGo[i][1]) ){															
			//increment / decrement its counter
			MenuGo[i][1]=(MenuGo[i][0])?MenuGo[i][1]+10:MenuGo[i][1]-10;												
			
			//apply changes
			if(document.all)document.getElementById("Sub"+i).style.filter="alpha(opacity="+MenuGo[i][1]+")";			
			else document.getElementById("Sub"+i).style.MozOpacity=(MenuGo[i][1]/100)-0.1;								
			}	
	}
}
setInterval('ShowHide()',45);

http://www24.brinkster.com/cabaretvoltaire/crapmenu.html

Time for a September challenge?

Dan

Yes it is. If RobertG gives no sign of life soon. Somebody will have to pick a new topic for the September 2005 - 20 lines JavaScript Contest.

Sounds like a game dying away... so let's try a little "change": why not making it a random event,
without a theme, like when you have a new 20 liner handy, post it as a 20 liner, in a thread with an explicit name.

This way, everyone is free to do what he pleases, to accomodate to his own schedule,
and one of the DHTMLaddicts around here could collect all 20 liners for a given month in a unique thread.

Plus a "request" to 20 liners people: such games are great in that they help push the limits of
the language we all luv, may I dig through the 20 liners "archives" and mirror them for ever and ever ( http://www.beyondwonderland.com )

I am likely to keep my website running for a couple more years, have Gigs of space and bandwidth, so with an appropriate credit for each
entry/creator, why not packing them all in one mirror?

Drop me an email about it at m DOT colella AT urbanet D-O-T ch.
Or leave a note right here in this thread.

Plus this is the chance for us to have a new "little" contest: design a 20 liners lobby.
The winner gets a subdomain @beyondwonderland.com, 50Megs of web storage/space, and 50 email adresses @beyondwonderland.com.

Jeff and I already collate ours:

http://www.codecouch.com/dan/

and

http://www.codecouch.com/jeff/

You're more than welcome to link to them, and while I can't speak for Jeff on this one, you're more than welcome to duplicate mine for your site, although at some point I plan to standardise the look-and-feel of my snippets too.

Dan

Coolness, BillRayPreachersSon, thanks a lot, will start the collection this weekend (hopefully) (if somebody has spare time, send some this way,
a couple of years of spare time if possible)... in the meantime, I quite like the idea of a js/css/html 20liners gallery...
could be js-less, though, even css-less, who cares? Wutcha guys think?

My 20 lines entries ( including the 'continued' ones ) are on the DHTML Contests page of my site.

I could give a hand for design or even the code of the 20 lines repository.

My entries, in chronological order:
http://www.west.co.tt/matt/js/ant_invasion/ (Aug 2004)
http://www.west.co.tt/matt/js/pinball/ (Sep 2004)
http://www.west.co.tt/matt/js/cheesemaze/ (Oct 2004)
http://www.west.co.tt/matt/js/gifplasma/ (Dec 2004)

Has it really been so long since I've entered one of these? Eek.

Mirror away as wished...

Poi > I could give a hand for design or even the code of the 20 lines repository.

Actually, I was proposing a "repository design contest" of some sort, so feel free to come with anything you'd like about it.
En français dans le texte, l'idée est de faire un "dernier contest" de webdesign pur, pour créer le repository,
et par la suite, de faire des 20 liners plus sporadiques.

Back to shingebis - to everybody who has entered the 20 liners in the past actually, yay! coolness, lotsa power to ya sir.

I'll have to credit you all properly so forum post or email, feel free to include nfo files, enhanced comments for your snippets,
ideas about the repository, "submissions" to the repository "contest", and so on.

Sorry, I've kinda been away for a while. A lot has changed for me, not least of which is that I've moved away from computers as a whole :/
The concept for the new system looks fun, and it would be interesting to see, even if it is a tad unlikely that I will ever enter one...

Anyway, most (all?) of mine reside here, do with them exactly as you like
http://www.wrayal.org/js.html

Wrayal

quote:

---

Poi > I could give a hand for design or even the code of the 20 lines repository.

Actually, I was proposing a "repository design contest" of some sort, so feel free to come with anything you'd like about it.
En français dans le texte, l'idée est de faire un "dernier contest" de webdesign pur, pour créer le repository,
et par la suite, de faire des 20 liners plus sporadiques.

---

It will teach me to check the Asylum at work

Just a quick note to let you know I am collecting... thanks everybody for your input. Anybody interested in the lobby thingie? Oh, and it's going slow,
but hey, I have this thing called a life and it's quite busy at the moment

Whoa, missed this.

My 20 liners that I still know where they are:
http://www.rpi.edu/~laporj2/art/dynamic/javascript/asteroidstribute/index.html
http://www.rpi.edu/~laporj2/art/dynamic/javascript/colorcube.html
http://www.rpi.edu/~laporj2/art/dynamic/javascript/particles.html

I can't seem to find any others. :/

I'd be happy to throw together a design for the lobby... could be fun. (And of COURSE I'd insert a 20-liner into the design itself )

---
Website

(Edited by Iron Wallaby on 09-19-2005 15:55)