If Else CSS Hovercode not working in jQuery

我的网页底部有六个按钮，每个按钮都有一个隐藏的“弹出”div，当您将鼠标悬停在按钮上时，它会上升并淡入。此功能可以正常工作，但由于按钮靠得很近，因此当您将鼠标从一个按钮悬停到另一个按钮时，通常可以使两个按钮重叠。If Else CSS Hovercode not working in jQuery

我试图建立一些jQuery代码，只允许css的'上升和淡入'的变化发生，如果所有其他弹出窗口低于页面的底部。这将允许所有的弹出窗口在当前悬停的按钮弹出之前进行重置。

不幸的是，代码无法正常工作。没有的弹出窗口现在正在改变它们的悬停CSS。

这是一个特定按钮的代码。

$('#chrome').hover(
      function() { 

       if (
       $("#inuithoverpopup").css("bottom") < '-130%' && 
       $("#bloghoverpopup").css("bottom") < '-130%' && 
       $("#cchoverpopup").css("bottom") < '-130%' && 
       $("#cwlhoverpopup").css("bottom") < '-130%' && 
       $("#blhoverpopup").css("bottom") < '-130%' && 
       ) { 
       $('#chromehoverpopup').animate({ 
        opacity: '1', 
        bottom: '95%' 
       }, 300); 
      } 

    }, 

    function() { 
      $('#chromehoverpopup').animate({ 
        opacity: '0', 
        bottom: '-159%' 
      }, 300); 

      });

任何人都可以看到我在这里做错了吗？

来源

2016-08-05 Bonfire Dog

您不能在两个字符串值上使用'<'运算符并获得可靠的结果。您需要将'.css（'bottom'）'解析为一个整数，并将其与一个整数进行比较 –

在尝试使用数字逻辑运算符之前，需要将字符串转换为Number。

尝试

parseInt($("#inuithoverpopup").css("bottom")) < -130

注意，返回的值将是像素，而不是%如你预期，因此相应调整的130%值。

来源

2016-08-05 07:50:58 Iceman

If Else CSS Hovercode not working in jQuery

回答

相关问题