Question

嗨我有一个5 p元素的列表，它们有蓝绿色背景，我想要那个当我悬停第二个元素时，第二个元素和第四个元素将文本颜色更改为橙色。当第二个没有悬停时，返回正常颜色。

<p id="t1"> test 1 </p>
<p id="t2"> test 2 </p>
<p id="t3"> test 3 </p>
<p id="t4"> test 4 </p>
<p id="t5"> test 5 </p>

p {
    background-color: teal;
    width: 100px;
}

p#t1:hover {
  color: yellow;
}


$(document).ready(
  function() {
    $("p#t2").hover(
      function() {
        $("p#t2").style("color", "orange");
        $("p#t4").style("color", "orange");
      },
      function() {
        $("p#t2").style("color", "black");
        $("p#t4").style("color", "black");
      }
    );
  });

http://codepen.io/anon/pen/jPOgPG

这是我的代码...... 怎么了？

Answer 1

*是一个DOM函数。你想要jQuery的style。

此外，对于您悬停的元素，您可以为该颜色创建一个css css()类，以将jQuery简化为另一个元素。

:hover

Answer 2

Style不是属性

$(document).ready(function(){
    $("p#t2").hover(
      function() {
        $("p#t2, p#t4").css("color", "orange");
      },
      function() {
        $("p#t2, p#t4").css("color", "black");
      }
    );
});

仅当另一个元素悬停时才更改元素的颜色

2 个答案: