Programming Forums > Web Development and Design > JavaScript and Client-Side Browser Scripting

Lance · Aug 31st, 2005, 8:07 PM

So I'm designing a little site to learn JavaScript and DHTML, and it's going to be a mini Window Manager. Yea, I'm kinda' crazy. Anyways...

http://grog.mine.nu/~lance

I'm trying to make the top 'taskbar' focus onto a window. If they overlap, I want the taskbar to change focus to the clicked title.

But I get this...

Error: document.getElementById("windowone").focus is not a function

focus() is supposed to be a built-in function of every element, according to the W3C DOM Level 1 Specifications.

What am I doing wrong...?

Eryk · Aug 31st, 2005, 8:32 PM

Those are java specifications, not javascript.

You can only use focus() on form elements, except in IE, which allows anything.
What do you need the focus on it for? (Just wondering)

Lance · Aug 31st, 2005, 8:46 PM

GAH! But I swear I was reading their page on JavaScript from w3.org/DOM. Then clicked the "Specifications" link. :/

Anyways, that sucks. I'll never get my focus working. It means I'll have to code it myself... and I have no clue how.

And by the way, I'm making a Window Manager. The top is a taskbar, the bottom DIV's are 'windows'. You get the picture.

Ooble · Aug 31st, 2005, 8:56 PM

What exactly do you want to do when you call the focus() function? Bring the window forward?

Eryk · Aug 31st, 2005, 8:58 PM

The focus function wouldn't exactly work for that. It works a bit differently.

The best way to go at it is like you said, to make a custom function.
It would just have to change the Z-index if I remember correctly.

Ooble · Aug 31st, 2005, 9:02 PM

That's exactly what I was thinking.

(Toggle Plain Text)

// assuming you have an array of windows called "windows"

function focus (element)
{
	element = document.getElementById(element);
	
	i = 0;
	for (i = 1; i <= windows.length; i++)
	{
		windows.style.z-index = i;
	}
	
	element.style.z-index = i;
}

Not tested, but it should work with a couple of inevitable bug fixes.

Lance · Aug 31st, 2005, 9:43 PM

z-index? I'll check it out.

And I'll check your code out later, Ooble. If I can't figure it out myself. You're half ruining the fun of coding this. You're making it lose hack value.

But thanks for your help.

Eryk · Aug 31st, 2005, 9:49 PM

You could always find another way of coding it. I konw it's annoying to do so, but meh.

Also, is the drag and drop yours? Because it looks familiar.

Lance · Aug 31st, 2005, 11:40 PM

(Toggle Plain Text)

var zindex = 5;
function raise(element)
{
	document.getElementById(element).style.zIndex = zindex;
	zindex++;
}

Yep. I did it. Simple.

Ooble: You made it more complex than it needed to be. :/

Eryk: They were actually taken from a tutorial. --> http://www.brainjar.com/dhtml/drag/

Rest of the code is mine.

Ooble · Sep 1st, 2005, 9:52 AM

Quote:

Originally Posted by Lance

Ooble: You made it more complex than it needed to be. :/

Not necessarily. If someone clicks yours enough times, your z-index variable will hit its maximum and either break or wrap round to negative something-or-other. So there. :p

Aug 31st, 2005, 8:07 PM	#1
Lance Programmer Join Date: Oct 2004 Location: Chicago, IL USA Posts: 74 Rep Power: 4	Built-in functions? So I'm designing a little site to learn JavaScript and DHTML, and it's going to be a mini Window Manager. Yea, I'm kinda' crazy. Anyways... http://grog.mine.nu/~lance I'm trying to make the top 'taskbar' focus onto a window. If they overlap, I want the taskbar to change focus to the clicked title. But I get this... Error: document.getElementById("windowone").focus is not a function focus() is supposed to be a built-in function of every element, according to the W3C DOM Level 1 Specifications. What am I doing wrong...? __________________ (Toggle Plain Text) /* LANCE / C++; / this makes C bigger but returns the old value / char site = "slackwise.net", home = "lance.slackwise.net", pics = "flickr.com/photos/slackwise"; /* LANCE / C++; / this makes C bigger but returns the old value / char site = "slackwise.net", home = "lance.slackwise.net", pics = "flickr.com/photos/slackwise";

Aug 31st, 2005, 8:46 PM	#3
Lance Programmer Join Date: Oct 2004 Location: Chicago, IL USA Posts: 74 Rep Power: 4	GAH! But I swear I was reading their page on JavaScript from w3.org/DOM. Then clicked the "Specifications" link. :/ Anyways, that sucks. I'll never get my focus working. It means I'll have to code it myself... and I have no clue how. And by the way, I'm making a Window Manager. The top is a taskbar, the bottom DIV's are 'windows'. You get the picture. __________________ (Toggle Plain Text) /* LANCE / C++; / this makes C bigger but returns the old value / char site = "slackwise.net", home = "lance.slackwise.net", pics = "flickr.com/photos/slackwise"; /* LANCE / C++; / this makes C bigger but returns the old value / char site = "slackwise.net", home = "lance.slackwise.net", pics = "flickr.com/photos/slackwise";

Aug 31st, 2005, 8:56 PM	#4
Ooble I eat cake for breakfast. Join Date: Jul 2004 Location: In my box. Posts: 4,434 Rep Power: 9	What exactly do you want to do when you call the focus() function? Bring the window forward? __________________ Me :: You :: Them

Aug 31st, 2005, 9:02 PM	#6
Ooble I eat cake for breakfast. Join Date: Jul 2004 Location: In my box. Posts: 4,434 Rep Power: 9	That's exactly what I was thinking. (Toggle Plain Text) // assuming you have an array of windows called "windows" function focus (element) { element = document.getElementById(element); i = 0; for (i = 1; i <= windows.length; i++) { windows.style.z-index = i; } element.style.z-index = i; } // assuming you have an array of windows called "windows" function focus (element) { element = document.getElementById(element); i = 0; for (i = 1; i <= windows.length; i++) { windows.style.z-index = i; } element.style.z-index = i; } Not tested, but it should work with a couple of inevitable bug fixes. __________________ Me :: You :: Them

Aug 31st, 2005, 9:43 PM	#7
Lance Programmer Join Date: Oct 2004 Location: Chicago, IL USA Posts: 74 Rep Power: 4	z-index? I'll check it out. And I'll check your code out later, Ooble. If I can't figure it out myself. You're half ruining the fun of coding this. You're making it lose hack value. But thanks for your help. __________________ (Toggle Plain Text) /* LANCE / C++; / this makes C bigger but returns the old value / char site = "slackwise.net", home = "lance.slackwise.net", pics = "flickr.com/photos/slackwise"; /* LANCE / C++; / this makes C bigger but returns the old value / char site = "slackwise.net", home = "lance.slackwise.net", pics = "flickr.com/photos/slackwise";

Aug 31st, 2005, 8:32 PM	#2
Eryk Programmer Join Date: Jul 2005 Posts: 62 Rep Power: 4	Those are java specifications, not javascript. You can only use focus() on form elements, except in IE, which allows anything. What do you need the focus on it for? (Just wondering)

Aug 31st, 2005, 8:58 PM	#5
Eryk Programmer Join Date: Jul 2005 Posts: 62 Rep Power: 4	The focus function wouldn't exactly work for that. It works a bit differently. The best way to go at it is like you said, to make a custom function. It would just have to change the Z-index if I remember correctly.

Aug 31st, 2005, 9:49 PM	#8
Eryk Programmer Join Date: Jul 2005 Posts: 62 Rep Power: 4	You could always find another way of coding it. I konw it's annoying to do so, but meh. Also, is the drag and drop yours? Because it looks familiar.

Aug 31st, 2005, 11:40 PM	#9
Lance Programmer Join Date: Oct 2004 Location: Chicago, IL USA Posts: 74 Rep Power: 4	(Toggle Plain Text) var zindex = 5; function raise(element) { document.getElementById(element).style.zIndex = zindex; zindex++; } var zindex = 5; function raise(element) { document.getElementById(element).style.zIndex = zindex; zindex++; } Yep. I did it. Simple. Ooble: You made it more complex than it needed to be. :/ Eryk: They were actually taken from a tutorial. --> http://www.brainjar.com/dhtml/drag/ Rest of the code is mine. __________________ (Toggle Plain Text) /* LANCE / C++; / this makes C bigger but returns the old value / char site = "slackwise.net", home = "lance.slackwise.net", pics = "flickr.com/photos/slackwise"; /* LANCE / C++; / this makes C bigger but returns the old value / char site = "slackwise.net", home = "lance.slackwise.net", pics = "flickr.com/photos/slackwise";

Currently Active Users Viewing This Thread: 1 (0 members and 1 guests)

Thread Tools
Show Printable Version Email this Page
Display Modes
Switch to Linear Mode Hybrid Mode Switch to Threaded Mode

Programming Forums > Web Development and Design > JavaScript and Client-Side Browser Scripting

Built-in functions?