鼠标悬停时闪烁的文本答案

【问题标题】：Blinking text on mouseover鼠标悬停时闪烁的文本
【发布时间】：2011-08-07 03:04:07
【问题描述】：

如何在 javascript 中摆脱鼠标悬停时闪烁的文本。我编辑了持续时间的数量，但没有任何不同。在我看来，它一点也不顺畅。我是一个相当新的网络开发人员，不确定 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>

【问题讨论】：

我认为您需要更好地解释这一点。它的行为似乎与您向我描述的一样。 jsfiddle.net/mrtsherman/SRLj9

标签： javascript onmouseover

【解决方案1】：

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

(+) 在父 div 中添加了一个“id”，如果您竭尽全力显示它，您可能不希望在滚动图片时链接消失。

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

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

【讨论】：