jQuery hover effect

Question

Я пытаюсь получить этот эффект http://www.un.org/. Имея в виду, что у вас разные ссылки, наведите курсор на соответствующий текст. Можно ли добиться этого с помощью jQuery?

Спасибо за помощь

Answer 1

Вы можете сделать это с помощью только CSS

<a href="#">My Link<span>My Hover Text</span></a> 

a span { display: none; } 
a:hover span { display: inline; } 

http://jsfiddle.net/TkVtm/

или для более сложного сценария вы можете использовать JQuery, чтобы сделать простой эффект при наведении:

$("#links li").hover(function() { 
    $("#text li:eq(" + $(this).index() + ")").toggle(); 
}); 

http://jsfiddle.net/TkVtm/1/

Answer 2

Вы можете использовать событие JQuery Hover() и просто изменить DIV, содержащий ваш соответствующий текст:

$("#hoverArea").hover(
    function() { 
    $("#textDiv").text("New Text"); 
    }, 
    function() { 
    $("#textDiv").text("Previous Text"); 
    } 
);