Question

我有以下代码：

<div class="portfolio">
    <a href="#" ><i></i>
        <span>
            <strong>douras.co</strong>
        </span>
    </a>
</div>
<div class="portfolio">
    <a href="#"><i></i></a>
</div>
<div class="portfolio">
    <a href="#"><i></i></a>
</div>
<div class="portfolio">
    <a href="#"><i></i></a>
</div>
<div class="portfolio">
    <a href="#"><i></i></a>
</div>
<div class="portfolio">
    <a href="#"><i></i></a>
</div>
<div class="portfolio">
    <a href="#"><i></i></a>
</div>
<div class="portfolio">
    <a href="#"><i></i></a>             
</div> 
<div class="portfolio">
    <a href="#"><i></i></a>
</div>

我想将悬停功能赋予链接中给出的跨度，并且我还需要在下面的所有链接中包含span以进行悬停。所以我需要jQuery函数。以下是每个列表的链接。

Answer 1

像这样使用

$(".portfolio a span").hover(function () {
  //your stuff here
 });

Answer 2

以下是mouseover和mouseleave功能

的功能

$(".portfolio a span")
.mouseover(function () {
  //your stuff here
 })
.mouseleave(function () {
  //your stuff here
 });

Answer 3

可能这就是你要问的问题。添加类似

的类

 <span class="spanhover">

现在在你的css写

.spanhover:hover
{
// give the style
}

在jquery中试试这个：

  $(".spanhover").hover(function () {
  //your stuff here
 });

Answer 4

$(".portfolio a").each(function ()
{
    $(this).append('<span>Span text</span>');
});//this will add span to all links
$(".portfolio a span").on('mouseenter',function ()
{
    alert('Hover');
});//this will add hover function to span inside link

这应该有效

Answer 5

试试这个：

$(".portfolio a span").hover(
    function() {
        // Your code to run when your mouse enter the span
    }, function() {
        // Your code to run when your mouse leave the span
    }
);

此外，由于您是初学者，我强烈建议您在jQuery官方网站上查看这些教程：https://learn.jquery.com/

Answer 6

希望你想要像this这样的东西。

$(".portfolio a span").hover(function () {
  $(this).css('color','#FF0000');
},function () {
  $(this).css('color','#0000FF');
});

使用jquery为这个html悬停功能

6 个答案: