Javascript Mouseover-Funktion

Question

ich diesen Code haben

Dies ist das Skript in meinem Kopf

<script src="jquery.js"></script> 
<script type="text/javascript"> 
$(document).ready(function() { 
$("#hmenu li a").hover(
    function() { 
    if ($("#hmenu li a").val == "Work") 
    { 
     alert ('halla') 
    } 

    }, 
    function() { 
     $(this).removeClass("active"); 
    } 
    ); 
    }); 
</script> 

Dies ist der HTML-Teil

<div id="headd"> 
<img src="logoname.png"/> 
</div> 
<div id="ll"> 
<p>My home, the front page and the main page</p> 
</div> 
<img id="da" src="logo.png" /> 
<div id="line"> 
    <img src="rr.gif" /> 
</div> 
<ul id="hmenu"> 
    <li><a class="active" href="#">HOME</a></li> 
    <li><a href="#">WORK</a></li> 
    <li><a href="#">PORTFOLIO</a></li> 
    <li><a href="#">ABOUT</a></li> 
    <li><a href="#">CONTACT</a></li> 
</ul> 

ich den Text in diesem Bereich ändern möchten: "#ll p", wenn der Benutzer auf den Anchor-Tags schwebt.

Zum Beispiel. Wenn der Benutzer auf Anchor-Tags mit einem Inhalt von "HOME" schwebt, dann vergleicht das JavaScript es mit if und sonst (ich weiß nicht, ob es einen anderen Weg gibt, aber ich bin offen für jeden Vorschlag), also das ist es: if #hmenu li ein Wert ist gleich Home dann dann #ll p Inhalt sollte in "Sie den Arbeitsanker schweben" und so den Rest ändern.

Answer 1

Hinzufügen @alexg und @Jay:

Es klingt wie Sie die Funktionalität des title Attribut wollen, aber anstelle eines Popup, geht der Titeltext auf eine vordefinierte Box.

Ich würde empfehlen, die title attr zu verwenden, da dies immer noch funktioniert, wenn js deaktiviert ist. Dann nehme ich an Sie schweben (MouseEnter-/mouseleave) Aktionen wie verwenden:

MouseEnter-: Entfernen Sie den Titel aus dem Link aber nicht für den Inhalt von ‚#LL p‘ mouseleave verwenden: dem Originaltitel auf den Link wiederherstellen und die ursprünglichen Inhalte von #ll p

ich bin nicht wirklich ein jQuery-Typ, aber so etwas wie:

$(function() { 
var text, title; 
$('#hmenu li a').hover(
    function() { 
    var $p = $('#ll p'), $a = $(this); 
    text = $p.text(); 
    title = $a.attr('title'); 
    $a.attr('title',''); 
    $p.text(title); 
    }, 
    function() { 
    $('#ll p').text(text); 
    $(this).attr('title', title); 
    } 
) 
}); 

#hmenu wird

<ul id="hmenu"> 
    <li><a class="active" href="#" title="My home, the front page and the main page">HOME</a></li> 
    <li><a href="#" title="Glad I'm not there now">WORK</a></li> 
    <li><a href="#" title="You really have to see this">PORTFOLIO</a></li> 
    <li><a href="#" title="I'm interesting once you get to know me">ABOUT</a></li> 
    <li><a href="#" title="Shazam">CONTACT</a></li> 
</ul> 

Siehe http://jsfiddle.net/heey3/

Answer 2

Wie wäre es

$('#hmenu li').hover(function() { 
    $('#ll p').text('you hover the '+$(this).text()+' anchor'); 
} 

Answer 3

Wenn Sie Text hinzufügen und dann zurück zu den ursprünglichen Text, können Sie Ihren Wert in Daten-Tag speichern kann. Schauen Sie sich dieses Beispiel:

http://jsfiddle.net/PjJfk/