[ktalebian]

Hi there,

I am using the code from the webpage
http://web-graphics....hive/001717.php
I'm modifying it so that the bubble loads some data from another website.
Now, the original code runs when the page reloads.
I changed it so that it runs when I move my mouse over the link. It worked, except that you had to move the mouse at least twice before you get the bubble (first time to initialize it).
So I wrote another function that would load on page, and would initialize it.
Its as followed:

function initTooltips(toolBar)
{
	var numLink,i,nameLink;
	numLink = document.getElementById(toolBar).getElementsByTagName("a");
	for( i=0;i<numLink.length;i++)
	{
		nameLink = "catLink"+numLink[i].name;
		runTooltips(numLink[i].name,nameLink);
	}
}

Now problem is that when I run this, it only initializes the last link! HOWEVER, if I put an alert() function in the for loop, and then press okay the number of times it shows up, THEN all links are initialized!! Why??

Thanks!

[thehat]

I think this is because you're calling your runTooltips function too quickly in sequence. Can you post the runTooltips function, and any variables that are created outside of the functions?

[ktalebian]

Hi and thanks for the reply.

Well, this is the runTooltips

function runTooltips(cID,lID)
{
	var links,h;
	h=document.createElement("span");
	h.id="btc";
	h.setAttribute("id","btc");
	h.style.position="absolute";
	document.getElementsByTagName("body")[0].appendChild(h);
	links = document.getElementById(lID);
	prepareLink(links,cID);
}

prepareLink basically then creates a HTTP request file, and then gets some information from another website, and then that calls the function that will create the bubble effect.

I also thought that this is because it is loading too fast, so I added a little delay loop inside it, and even after setting it to like 10 seconds, it still did not work! It only works when I use alert() (so I am pausing the whole process).

Cheers

[thehat]

It looks like every time you are calling that function you are creating a new span with the same id. Id's should be unique so maybe create a counter outside of your function that can be incremented with every function call. The use that value to assign unique a new id each time:

var myCounter = 0;
function runTooltips(cID,lID)
{
	var links,h;
	h=document.createElement("span");
	h.id="btc"+myCounter;
	h.setAttribute("id","btc"+myCounter);
	myCounter++;
	h.style.position="absolute";
	document.getElementsByTagName("body")[0].appendChild(h);
	links = document.getElementById(lID);
	prepareLink(links,cID);

}

Admittedly I'm not testing this as I go, it's all just conjecture. Hope it helps!

[ktalebian]

Hey,

I tried that, and this actually does not even let the script work! Apparently, we only have one span that is just moved in position!