HTML/PHP/CSS/jQuery:是否有可能依赖于文本或链接的URL悬停


HTML/PHP/CSS/jQuery: Is it possible to depend a:hover on the text or the URL of the link?

我考虑是否有可能确定哪个链接处于悬停状态。例如,如果我悬停http://google.com/一个div应该弹出(display:block)并显示谷歌的标志如果我悬停stackoverflow.com的stackoverflow标志等等。

这可以实现与一个:hover或我必须把每个链接在它自己的div?

非常感谢!

您可以通过为所有a元素分配侦听器来实现这一点。

$('a').hover(function() {
  var href = $(this).attr('href');
  if (href == 'http://stackoverflow.com') {
    // do your thing
  }
});

如果你不想做精确的url匹配,你可以为你的a元素添加特殊的数据属性,并检查它们。

<a data-rel = 'stackover' href="http://stackoverflow.com">SO</a>
$('a').hover(function() {
   var rel = $(this).data('rel');
   if (rel == 'stackover') {
     // do your thing
   }
});