Im trying to code a function that will make the value of a paragraph element equal to the title attribute of an image, whenever the image is hovered.

Basically my script puts every <img> tag into an array, and checks to see if it is inside a div with the id of 'portThumbWebsite'.

if it is in that div, it is supposed to make the paragraph value change so that it is the same as the image's title attribute.

Instead, the onMouseOver event handler just seems to be ignored, and the paragraphs value is just set to be the same as the last index of the array of image titles.

Maybe the code will help to explain!

// display the name of the project on thumb hover

function thumbChange (thumbTitle)    
    {
        // set pWebsite equal to image title on hover
        pWebsite = document.getElementById ('pWebsite');
        pWebsite.firstChild.nodeValue = thumbTitle;
    }
        
function portTitleDisplay ()
    { 
        // declare variables
        divPortThumb = document.getElementsByTagName ('img');
        thumbId = new Array ();
        thumbTitle = new Array ();

        // loop through thumb id's titles
        num = divPortThumb.length;
            
        // declare index to be used as array indexes
        index = 0;
        for (i = 0; i < num; i ++)
            {
                // only perform in specified div
                divPortThumbId = divPortThumb[i].parentNode.parentNode.parentNode.id;
                
                if (divPortThumbId == 'portThumbWebsite')
                    {
                        thumbId[index] = divPortThumb[i].id;
                        thumbTitle[index] = divPortThumb[i].title;
                        
                        // change value of pWebsite on hover of thumb
                        thumbId[index].onMouseOver = thumbChange (thumbTitle[index]);
                        index ++;
                    }
            }
    }
    
window.onload = portTitleDisplay;

Does anyone know what I might be doing wrong? There appears to be no actual errors in the syntax.

One thing I see is that thumbId[index].onMouseOver should be thumbId[index].onmouseover. Event handlers should always be lower-case in JavaScript.