Изменение текста на сайте при наведении указателя мыши на ссылку

Question

Не уверен, что это возможно, но у меня есть текст на моем сайте, который я бы хотел изменить, когда есть мышь над ссылкой.

Например. Слово «Дом» появляется наполовину вниз по странице. Когда пользователь наводит свою мышь на отдельную ссылку, я бы это слово изменил на то, что я укажу для этой ссылки. Способ Анти сделать это?

Благодаря

Answer 1

Вы можете попробовать что-то вроде этого:

<p>hover me!</p> 

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"> 
</script> 
<script> 
$(document).ready(function(){ 
    $("p").hover(function(){ 
    $("p").html("You are hovering me!"); 
    },function(){ 
    $("p").html("hover me!"); 
    }); 
}); 
</script> 

Answer 2

Вы можете добавить класс для вашей ссылки, которые хотят, чтобы вызвать изменения текста, а затем подписаться мыши на события для этого класса и изменить текст .. похоже на кусок пирога

<a href="whatever" class="linkClass" data-text="textToChange">link</a> 

код

$(".linkClass").live("mouseover", OnMouseEnter); 

function OnMouseEnter(event){ 
    var newText = $(event.target).attr('data-text'); 
    $("#tbxHome").text(newText); 
} 

Answer 3

Если вы всегда будете знать, что вы хотите, чтобы текст парения быть, вот CSS-единственный вариант:

<style> 
    a:hover .replace-me { 
    display:none; 
    } 
    a:hover:after { 
    content:'Switcheroo!'; 
    } 
</style> 
<a href="#"><span class='replace-me'>Hover on me!</span></a> 

Демо: http://codepen.io/anon/pen/hnvFD