首页 文章

使用jquery更改不透明度和文本颜色

提问于
浏览 次
0

希望这个问题不是太傻了......我还是个初学者！

我正在尝试 Build 我的投资组合网站，它可以在hellothisis.cc看到

我的目标是让版权符号在几秒钟内完全不透明，然后降低到.1不透明度，我相信我成功了 . 代码可能是贫民窟，但它有效吗？我还希望它有一个悬停属性，当悬停时，将版权符号更改为完全不透明的红色，然后在移动鼠标时返回淡出的灰色 .

这是我到目前为止的代码，包括版权符号所具有的隐藏和点击功能 .

<script type="text/javascript">

    $(document).ready(function() {
      $(".name").delay(1000).fadeTo('slow', 0.1, function() {
         $(".name").hover(function() {
             $(this).animate({ opacity: 1 });
             });
      });
    });

    $('.bio').hide();
    $('.name').click(function(){
        $('.bio').fadeToggle(1000);
    });
</script>

我现在的问题是，将鼠标悬停在褪色的灰色上后，即使将鼠标移开，它仍保持完全不透明度？非常感谢任何帮助，谢谢！

jquery opacity

2 回答

  • 0

    绑定直接，你不需要等待延迟fadeto完成（如果有人鼠标悬停在fadeto期间它会回到不透明度1，这是更合乎逻辑的imo

    $(".name").on({
          mouseover : function(e) {
                   $(this).stop().animate({ opacity: 1 });
         },
          mouseout : function(e) {
                   $(this).stop().animate({ opacity: 0.1 });
          }
 }).delay(1000).fadeTo('slow', 0.1);

    编辑：按顺序排列

    回复于
  • 0

    您可以使用：

    $(".name").hover(function() {
  $(this).animate({ opacity: 1 });
}, function(){
  $(this).animate({ opacity: .1 });
});

    触发 mouseenter 事件时使用第一个函数，第二个函数在调用 mouseleave 事件时使用 .

    但我建议未来考虑event delegation，因为它会更好地为你服务 .

    回复于

相关问题