Not using correctly javascript setTimeout / clearTimeout?

Not using correctly javascript setTimeout / clearTimeout?

I have problem with simple javascript and some ajax.
I have link that calls javascript function like this:
<div id="Button11" onmouseover="changeContent4()">Actions</div>
Javascript function that is called above is like this:
function changeContent4()
{
BubbleOn()
document.getElementById("text1").innerHTML='Some text here';
clearTimeout(BOffi);
var BOffi = setTimeout(BubbleOff, 20000);
}
This works, it runs BubbleOn function, places text to element text1, most
likely it empties BOffi timeout and sets new timeout 20000ms for it.
Here is BubbleOn:
function BubbleOn() {
$("#bubble").fadeIn(function() {
})
}
And here is BubbleOff:
function BubbleOff() {
$("#bubble").fadeOut(function() {
})
}
As in functions BubbleOn and BubbleOff works. They just hide or show div
named bubble which contains text1 element. When BOffi goes timeout it just
runs the BubbleOff function. This works fine. The problem is that when
BubbleOff has been run and mouse is placed immediately over link that runs
changeContent4(), It does make the bubble div visible again and places
text there again but then bubble div fades out inside a second! Not after
20000ms. After this if the mouse is placed again to run changeContent4()
everything works great. If there is about millisecond longer time than a
second between the bubble fadeout and placing the mouse over
changeContent4() launcher it works and waits 20000ms. Less than a second
and bubble is shown about second...
What can cause this? Could it be that fadeOut is still running even the
bubble is vanished from the screen and therefore it does not reset the
BOffi counter? Which could have 1 second or less time left and then runs
BubbleOff again after that magical second?