【问题标题】:Jquery Fadein toggle keep flickering (using wordpress)Jquery Fadein切换保持闪烁(使用wordpress)
【发布时间】:2013-03-20 11:20:34
【问题描述】:

我正在创建一个 wordpress 博客并使用了“非常简单的 facebook twitter 分享按钮 (http://wordpress.org/extend/plugins/really-simple-facebook-twitter-share-buttons/)

在设置中,我选择查看帖子下方的共享图标,并且我有一个入口页脚。该插件实际上将图标放在入口页脚上方,因此我必须绝对定位它们并将它们向下移动。

我想要一个隐藏图标的效果,然后当用户将鼠标悬停在共享文本(或条目页脚本身)上时,图标显示为淡入/淡出效果。我已经对所有这些进行了排序,但是当用户将鼠标悬停在图标本身上时,图标绝对定位,共享文本上的颜色会变淡并且图标会闪烁。我在共享和条目页脚周围添加了一个填充,因此如果用户在此处附近的任何位置输入鼠标,图标就会出现,但是当用户浏览图标时,显然 jQuery 认为他们已经离开了这个区域并且正在淡出。如果有人可以帮助我解决这个问题,我将不胜感激。

这里是支持代码:

jQuery:

$(document).ready(function () {   
   $('.entry-footer').mouseover(function() {
     $('.really_simple_share').fadeToggle(400);
   });
 });

css:

.entry-footer a{
  height:88px;
}

h1.share a{
  padding:30px 560px 40px 30px;
  float:left;
}

.entry-footer a:hover {
  color:#79b74c;
}

.really_simple_share {
    position:absolute;
    margin:44px 0px 0px 140px;
    display:none;
}

我还在此处发布了一个关于图标位于帖子顶部和底部且无法在页脚内移动的问题:http://wordpress.org/support/topic/social-icons-showing-twice-in-posts?replies=1#post-3994811

【问题讨论】:

    标签: jquery css hover wordpress


    【解决方案1】:

    当你将鼠标悬停在对象上时,你会触发一个淡入淡出切换。这意味着如果你的鼠标停留在上面,它会一直消失。

    试试

    $(document).ready(function () {   
       $('.entry-footer').hover(function() {
         $('.really_simple_share').fadeIn(400);
       },
       function(){
         $('.really_simple_share').fadeOut(400);
       });
    });
    

    【讨论】:

    • 不幸的是,这使情况变得更糟:(。我尝试过悬停、鼠标输入/鼠标悬停等。我有一种暗示,因为社交图标没有嵌入到 entr-footer 上,因此它们位于这个文件。(我帖子底部的链接目前正在询问是否有办法使用这个插件来做到这一点。)。谢谢你的回答。
    • 我已经通过将 jQuery 中的 class(entry-footer) 更改为 .share a 来修复了一半,现在这不会闪烁我只需要整理共享文本的颜色.
    • 您可能会将您的 HTML 发布到其他地方,我真的无能为力。
    猜你喜欢
    • 2023-03-16
    • 2011-10-01
    • 2013-03-03
    • 1970-01-01
    • 2013-02-12
    • 1970-01-01
    • 1970-01-01
    • 2011-01-06
    • 1970-01-01
    相关资源
    最近更新 更多