[thelist] Javascript setTimeout losing object properties

[VOLKAN ÖZÇELİK]

> setTimeout("fadeIn('" + obj + "')", 100);

you are trying to pass an object reference to fadein method, but what
you are acutally passing is nothing but the object converted to a
string

use 

setTimeout("fadeIn(document.getElementById('" + obj.id + "'))", 100);

instead.

I've not tested, but it should sort out the problem.

Apologise me, just my humble opinion, but you had better read some tutorials on
setTimeout, setInterval, javascript timers, eval method etc. before
diving deep into the code.


HTH,
Volkan.


On 6/25/05, Iain <iain at firelightning.com> wrote:
> Hi all,
> 
> This is the code that's causing me to tear my hair out:
> 
> function initialisePictureMenu()
> {
>        if (!document.getElementById || !document.getElementsByTagName)
>        {
>                return;
>        }
>        var pictureMenu = document.getElementById('pictureMenu');
>        var pictureMenuItems = pictureMenu.getElementsByTagName('li');
> 
>        for (var i = 0; i < pictureMenuItems.length; i++)
>        {
>                // Apply initial opacity value to all menu objects:
>                setOpacity(pictureMenuItems[i], 50);
>                // Attach event handlers to the menu items:
>                pictureMenuItems[i].onmouseover = function() { fadeIn(this); }
>                pictureMenuItems[i].onmouseout = function() { fadeOut(this); }
>        }
> }
> 
> function setOpacity(obj, opacity)
> {
>        // IE filter opacity:
>        obj.style.filter = "alpha(opacity:" + opacity + ")";
>        // Safari and Konqueror:
>        obj.style.KHTMLOpacity = opacity / 100;
>        // Old Mozilla and Firefox:
>        obj.style.MozOpacity = opacity / 100;
>        // CSS3 opacity for browsers that support it:
>        obj.style.opacity = opacity / 100;
> }
> 
> function fadeIn(obj)
> {
>        var opacity = obj.style.opacity * 100;
>        if (opacity < 100)
>        {
>                opacity += 10;
>                setOpacity(obj, opacity);
>                setTimeout("fadeIn('" + obj + "')", 100);
>        }
> }
> 
> function fadeOut(obj)
> {
>        var opacity = obj.style.opacity * 100;
>        if (opacity > 50)
>        {
>                opacity -= 10;
>                setOpacity(obj, opacity);
>                setTimeout("fadeOut('" + obj + "')", 100);
>        }
> }
> 
> window.onload = initialisePictureMenu;
> 
> When I mouseover the list items, the fadeIn() function only executes once and then I get errors telling me that obj.style has no properties.  The same happens on mouseout.  Could someone put me out of my misery and tell me what's wrong?
> 
> Thanks,
> 
> Iain
> 
> --
> 
> * * Please support the community that supports you.  * *
> http://evolt.org/help_support_evolt/
> 
> For unsubscribe and other options, including the Tip Harvester
> and archives of thelist go to: http://lists.evolt.org
> Workers of the Web, evolt !
>