悬停时的Javascript，焦点操作答案

【问题标题】：Java Script on hover, on focus actions悬停时的Javascript，焦点操作
【发布时间】：2014-10-11 10:00:09
【问题描述】：

我对 Java Script 的编码不太了解。我有一些代码，它使元素可见。所以效果很好！但！当您移动鼠标时，它会在 0.5 sec - 1 sec 内不可见。据我了解，我需要通过焦点动作来发挥作用？当鼠标悬停在焦点上时，该元素必须始终可见。

jQuery(document).ready(function($){


    $('.fdw-background').hover(
        function () {
            $(this).animate({opacity:'1'});
        },
        function () {
            $(this).animate({opacity:'0'});
        }
    );


    $( ".fdw-background" ).hover(function(){
      $( ".fdw-background" ).focus(
        function () {
            $(this).animate({opacity:'1'});
        }
    })
    );


});

【问题讨论】：

我认为你的代码的倒数第三行 (})) 应该是 )，之后的代码 ();) 应该是 });
这是你想要的吗？ testnaman.neocities.org/quicktest7.html
快速创建 jsfiddle
@jQueryAngryBird 你去吧：jsfiddle.net/b21jwx44

标签： javascript jquery hover focus

【解决方案1】：

不需要焦点事件。只需将元素的初始不透明度设为 0：

CSS

.fdw-background {opacity: 0;}

并在触发新动画之前停止运行动画以防止像这样闪烁：

$('.fdw-background').hover(
    function () {
        $(this).stop(true).animate({opacity:'1'});
    },
    function () {
        $(this).stop(true).animate({opacity:'0'});
    }
);

DEMO here。 --------- jQuery.fn.stop() here

【讨论】：