Question

我正试图建立一个帮助中心＆＃34;在HTML中，当我将鼠标悬停在一个选项上时，我需要更改背景，div，我认为＆＃34;它有点问题，但我有一个问题，当我将鼠标悬停在div时，我进行了背景更改，但是当我将鼠标悬停在div上时，它隐藏了其他所有内容，例如div更改背景是所有其他人的首选，所以它隐藏了所有这些... JsFiddle 所以我想尽可能更改body背景，或者像我一样制作并将div作为背景来改变它。我试着这样做：

selection:hover>body{
    background-image:url(DIR);
}

但......不起作用......所以，是的，谢谢你试一试！

Answer 1

这很容易用jQuery实现，jQuery是一个流行的javascript库

我会做像

这样的事情

$( "#someID" ).hover(
  function() {
    $( "#anotherElement" ).css( "background-color", "red" );
  }, function() {
    $( "#anotherElement" ).css( "background-color", "white" );
  }
);

将使用ID＆＃34; someID＆＃34;然后设置＆＃34; anotherElement＆＃34;的背景颜色。当你将鼠标悬停在＆＃34; someID＆＃34;上时，将其设置为红色，并在离开后将其设置为白色。你也可以只针对＆＃34;身体＆＃34;通过做：

$( "#someID" ).hover(
  function() {
    $( "body" ).css( "background-color", "red" );
  }, function() {
    $( "body" ).css( "background-color", "white" );
  }
);

要在HTML文档中包含jquery，您可以通过添加

从谷歌的cdn加载jquery库

<script src="http://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

在你的html文档中。

要调用上面的代码，请将其包装在自调用函数中，如下所示：

  <script>
    (function(){
      CODE GOES HERE
    })();
  </script>

如果这对您没有意义，请阅读：Short Introduction to jQuery

~~我还没有对代码进行测试，因此可能存在拼写错误或错误，但概念可用~~;）

编辑：我现在已经测试了我的代码..它确实有效，请参阅下面的

<!doctype html>

<html>
<head>
</head>
<body style="background-color:white">
<div id="someID">
<p>If you hover over this the color changes</p>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script>
    (function(){
        $( "#someID" ).hover(
            function() {
                $( "body" ).css( "background-color", "red" );
            }, function() {
                $( "body" ).css( "background-color", "white" );
            }
        );
    })();
</script>
</body>
</html>

充当背景的<div> </div>

1 个答案: