鼠标输入在影响某物时不影响按钮

Question

我需要一个调色器。在元素按钮上的mouseenter上，其背景颜色将更改为其他颜色。在MouseLeave上，它的默认颜色再次返回。为此我编写了以下代码:

null

jQuery(document).ready(function($) {
  "use strict"
  
  $(".elementor-button").mouseenter(function() {
    $("elementor-button:hover").css("background-color", "purple");
    $("p").css("background-color", "purple");
    $("elementor-button").css("color", "purple");
  });
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<a href="#" class="elementor-button-link elementor-button elementor-size-md" role="button">
  <span class="elementor-button-content-wrapper">
    <span class="elementor-button-text">Contact US</span>
  </span>
</a>

null

p的代码可以工作，但是关于紫色的其他命令不能工作。

https://resimli.yedek.deniz-tasarim.site/

https://i.ibb.co/cwhm6jd/image.png

如上图所示，“联系我们”按钮是一个元素按钮。我错在哪里？

Answer 1

您还没有在那里放一个有效的选择器，您可以添加一个额外的ID来进行一个有效的选择。下面的代码应该可以工作:

jQuery(document).ready(function($) {
  "use strict"
  
  $(".elementor-button").mouseenter(function() {
    $("p").css("background-color", "purple");
    $(".elementor-button").css("color", "purple");
  });
});