jquery - jQueryホバー効果

Question

私はこの効果をhttp://www.un.org/にしようとしています。さまざまなリンクがあることを意味します。ホバーすると、対応するテキストが下に表示されます。jQueryを使用してこれを達成することは可能ですか？

助けてくれてありがとう

score 5 · Accepted Answer

CSSだけでこれを行うことができます

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

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

または、より複雑なシナリオでは、jQueryを使用して単純なホバー効果を実行できます。

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

score 1 · Accepted Answer

jQuery Hover（）イベントを使用して、対応するテキストを含むdivを変更することができます。

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

2 に答える 2