使用 jquery 的此 html 的悬停功能答案

【问题标题】：Hover function for this html using jquery使用 jquery 的此 html 的悬停功能
【发布时间】：2015-04-16 00:30:34
【问题描述】：

我有以下代码：

<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>

我想为链接内给出的跨度提供悬停功能，并且我需要在下面的所有链接中包含跨度以进行悬停。所以我需要 jQuery 函数。下面给出了每个列表的链接。

【问题讨论】：

你想达到什么目的？
我想要悬停功能的脚本
而且只有当鼠标移到上面时我才需要使用 span 功能
@CarstenLøvboAndersen，当您没有更正任何拼写时，为什么您将编辑命名为 Corrected Spelling？请准确标记您的 cmets，否则可能导致他们被拒绝。
jsfiddle.net/nnBK5/1 这是你想要的吗？但是你想用这个实现什么？

标签： javascript jquery html css hover

【解决方案1】：

这样使用

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

【讨论】：

【解决方案2】：

这是mouseover 和mouseleave 函数的函数

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

【讨论】：

鼠标输入不是鼠标悬停！
@RakeshKumar mouseover 不像 mouseenter 那样冒泡
东西是什么意思？？我只是一个初学者

【解决方案3】：

可能这就是您要问的问题。添加一个类来跨越像

 <span class="spanhover">

现在在你的 css 中写

.spanhover:hover
{
// give the style
}

在 jquery 中试试这个：

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

【讨论】：

【解决方案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

这应该可以工作

【讨论】：

我也给 span 和 strong .portfolio span{ background: none repeat scroll 0 0 rgba(0, 0, 0, 0.7);颜色：#FFFFFF；字体大小：33px；高度：170px；左：1px；位置：绝对；文本对齐：居中；宽度：320px； } .portfolio span strong{ 显示：块；填充：56px 9px 5px 13px； }

【解决方案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/

【讨论】：

【解决方案6】：

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

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

【讨论】：

你应该在回答时在这里发布代码，而不仅仅是一个链接。（如果有人访问此页面期待答案时 jsbin 出现故障，会发生什么情况？）
只粘贴代码和观看直播是不同的。
@PaulShan 我从来没有说过“只有代码”。我特别强调说“不是只是链接”。您也需要发布代码，否则这将被标记为不是答案，并且非常正确地被删除。