Question

所以这是我目前的代码，我遇到的问题是：即使我没有在$('#intro').fadeOut上徘徊，为什么$('arena').hover也会被激活？我还有其他任何问题，所以代码无论如何都不会起作用吗？

＆＃13;

$(document).ready(function() {
  $('#arena').hover(); {
  	$('#intro').fadeOut('slow'); {
      

    }
  }
});

＆＃13;

html, body {
  padding: 0 autp;
  margin: 0 auto;
}



#cirkle {
  height: 150px;
  width: 150px;
  background-color: blue;
  border-radius: 25%;
  transition: all 1s ease-in-out;
  border: black 1px solid;
  position:relative; /*gotta put it here too to start it off*/
  top:35%;
  left:35%;
}
#intro {
  text-align: center;
  margin-top: 75px;
  overflow: hidden;
  font-family: 'Indie Flower', cursive;
  font-size: 50px;
}

body {
  background-color: #cccccc;
}

#cirkle:hover {
  border: black 1px solid;
  background-color: red;
  border-radius: 50%;
  height: 75px;
  width: 75px;
  transition: 1.5s;
  -webkit-animation-name: cruise;
  -webkit-animation-duration: 60s;
  animation-name: cruise;
  animation-duration: 50s;
  position:relative;
  top:50%;
  left:50%;
  transition: all 1s linear;
}

#arena {
  border: 5px dashed grey;
  margin: 0 auto;
  width: 550px;
  height: 550px;
  margin-top: 150px;
  background-color: white;
  border-radius: 10px;
  overflow: hidden;
}

 @keyframes cruise {
    0%    {left:35%; top:35%;}
    5%    {left:40%; top:40%;}
    10%   {left:45%; top:45%;}
    15%   {left:50%; top:43%;}
    20%   {left:57%; top:50%;}
    25%   {left:67%; top:40%;}
    30%   {left:70%; top:27%;}
    35%   {left:55%; top:35%;}
    40%   {left:35%; top:67%;}
    45%   {left:15%; top:40%;}
    50%   {left:40%; top:65%;}
    55%   {left:50%; top:25%;}
    60%   {left:82%; top:65%;}
    65%   {left:26%; top:15%;}
    70%   {left:69%; top:70%;}
    75%   {left:85%; top:15%;}
    80%   {left:36%; top:78%;}
    85%   {left:65%; top:41%;}
    90%   {left:85%; top:26%;}
    95%   {left:58%; top:78%;}
    100%  {left:35%; top:35%;}
    }

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<title>
            Test
        </title>
      
 
        <script src="script.js"> </script>
  
  <body>
      <h1 id="intro">
        <ins>HÅLL MUSEN PÅ DEN BLÅA FYRKANTEN</ins>
      </h1>
    <div id="arena">
        <div id="cirkle">

        </div>
    </div>

  </body>
</html>

＆＃13;

Answer 1

您有几个语法错误。您需要提供一个函数作为参数来定义悬停行为。

像这样调整你的代码：

-O3 -fomit-frame-pointer

JQuery .hover在没有悬停时激活

1 个答案: