Javascript 有没有更简单的方法来简化此代码？还有人能解释一下逗号吗？

我有两个问题，因为我是新来的

1） 有没有办法简化这段代码？ 基本上在元素悬停时会出现一个div。我想用鼠标在网站的社交图标上复制效果。这是创造这种效果的正确方法吗

2） 有人能给我解释一下这里的逗号函数吗？我的意思是，在一个事件中，我看到两个函数（它们实际上正在执行我所寻找的任务），但我想了解逗号的含义是什么？ 我想了解在事件中逗号之后的第二个“位置”是什么意思

希望是明确的

$(".social-size-logo").hover(
  function() {
    $(".color-social-div").css({
      "opacity": "1",
      "z-index": "999"
    });
  },
  function() {
    $(".color-social-div").css({
      "opacity": "0",
      "z-index": "-1"
    });
  });

---

jQuery的hover函数接受两个方法作为参数，第一个在鼠标输入选定元素时执行，第二个在鼠标离开元素时执行

$(element).hover( mouseInHandler, mouseOutHandler );

你可以阅读更多关于它的内容

现在，来看看您发布的代码片段，我将尝试对其进行内联解释

$(".social-size-logo").hover( // Attach the hover event handler
  function() { // This is the `mouseIn` method
    $(".color-social-div").css({ //We add the CSS to make the element visible, 
      "opacity": "1", // set the opacity to 1 to make it visible
      "z-index": "999" // bump up the z-index to bring it to the top
    });
  },
  function() {// This is the `mouseOut` method
    $(".color-social-div").css({
      "opacity": "0",
      "z-index": "-1"
    });
  });

有许多奇特的动画和过渡一起制作动画，但归根结底是：

用户进入社交图标区域->启动事件，使页面包装成为焦点，并将其置于其他所有内容之上

显示图标的相应覆盖图 提示：检查

div.overlays-wrapper

元素在悬停时的行为以了解这一点

当用户离开->重置所有内容时

---

请参阅.hover（handlerIn，handlerOut）的文档。您应该使用CSS

：hover

选择器。这是两个参数，与任何其他参数一样。同意SLaks。如果只是管理css，请仅使用css。如果您需要js中的任何其他行为，那么可以使用js事件。