javascript - 鼠标悬停时闪烁文本

Question

如何在 JavaScript 中消除鼠标悬停时闪烁的文本。我编辑了持续时间，但没有任何不同。在我看来一点也不顺利。我是一个相当新的 Web 开发人员，不确定 javascript 代码中的哪些内容需要正确编辑。顺便说一句，我想要实现的是，当页面首次加载时，文本将被隐藏，直到鼠标悬停，将显示 2 行，并且 onmouseout 文本将再次消失(闪烁文本始终出现在 onmouseover 时)，然后当 onclick 时调用另一个函数，fancybox。

<script type="text/javascript">
            $(document).ready(function(){
            $(".msg-link").hover(
            function(){
                var id = $(this).data("id");
                    if(id!==undefined){
                        $("#" + id).show();   
                    }
                        $("#textMessages").show();

                    },function(){
                    $("#textMessages").hide();
                    $(".hidden").hide();
                });
            });

            function ShowHide() {
                alert('here');
                $("#textMessages").animate({
                    "height": "toggle"
                }, {
                    duration: 1000
                });
                }
</script> 

<div>
    <img class="msg-link" data-id="test" src="1.png" alt="" />
       <p id="textMessages">test<br />
        <a class="hidden" id="test" href="1.png" rel="group1" title="example title text">More View</a>
        <a class="hidden" id="koya" href="2.png" rel="group1" title="more text right here"></a>
       </p>
</div>

Answer 1

听起来这是一个以动画为中心的问题，您想要平滑的显示/隐藏类型的动画吗？在我看来，你实际上应该使用 fadeIn 或 fadeOut 来获得最终的平滑度。但是你可以在 show() hide() 上设置时间(如果这是你真正喜欢的)..或者你可以结合淡入淡出和改变父元素的高度，这样它就会产生一点开放效果，但不会产生锯齿状缩放从左到下的效果。

(+) 在父 div 中添加了一个“id”，如果您费了很大力气才显示它，那么当您滚动图像时，您可能不希望该链接消失。

我将 mrtsherman 的示例修改为我认为您想说的内容。我确信它可能会像您尝试做的那样更有活力。但这是我假设的动画或效果问题吗？对吗？

http://jsfiddle.net/SRLj9/9/