Hover event and <a> title attribute

Hover event and <a> title attribute

Hi,

Problem: I need to set a <span> tag's text to whatever the title attribute of <a> says using the Jquery hover event.

HTML:


<ul id="ulmenu">
   <li class="menuLink"><a href="index.aspx" title="hej1">Startsidan</a></li>
   <li class="menuLink"><a href="presentation.aspx" title="hej2">Presentation</a></li>
   <li class="menuLink"><a href="exhibitions.aspx" title="hej3">Utställningar</a></li>
   <li class="menuLink"><a href="gallery.aspx" title="hej4">Galleriet</a></li>
   <li class="menuLink"><a href="calendar.aspx" title="hej5">Kalender</a></li>
   <li class="menuLink"><a href="contact.aspx" title="hej6">Kontakt</a></li>
</ul>
<span id="linkinfo"></span>


CSS:


#ulmenu
{
   padding-top: 50px;
}

.menuLink
{
   list-style-image: url('../Images/bullet.png');
}

.menuLink a
{
   color: White;
   text-decoration: none;
}

#linkinfo
{
   background-color:White;
   color:Black;
   margin-left: 40px;
}


JS-File


$(function() {

    $('.menuLink a').hover(

    function() {
   
        var textinfo = $(this).attr('title').text();
        $('#linkinfo').text(textinfo);
        $('#linkinfo').stop().animate({ opacity: "show" }, "slow");
    },
    function() {


        $('#linkinfo').stop().animate({ opacity: "hide" }, "fast");
    });
});


Hover works fine if i mark out the two rows in the first hover function
that says

        var textinfo = $(this).attr('title').text();
        $('#linkinfo').text(textinfo);


and set the span tag to <span id="linkinfo">SOME STATIC TEXT</span> to actually show something.

Ant thoughts! It's a simple problem i know! Still learning!

Daniel Svensson from Sweden