Javascript fadein鼠标悬停工作，但不fadeout

所以真实简单，我已经想出了如何淡出鼠标悬停呼叫div。但我想知道如何淡出它，而不是简单地重复它已经存在的JavaScript对立面，并将它链接到一个onmouseout。Javascript fadein鼠标悬停工作，但不fadeout

这里是我的javascript：

<script type="text/javascript"> 
    function fadein(objectID){ 
object = document.getElementById(objectID); 
object.style.opacity = '0'; 

animatefadein = function(){ 
if(object.style.opacity < 1){ 
var current = Number(object.style.opacity);  
var newopac = current + 0.1; 
object.style.opacity = String(newopac);  
setTimeout('animatefadein()', 100); 
} 
} 
animatefadein(); 
}

和我的HTML

<div id="rolloverwrapper" style="opacity:0;"></div> 
<div id="wrapper"> 
    <div id="content"> 
     <div id="button"> 
      <img src="images/dj.png" onmouseover="fadein('rolloverwrapper');"/> 
     </div> 
    </div> 
</div>

来源

2012-01-05 Chris James Champeau

如果你想要的行为是你已经有相反的，但在不同的事件，然后简单地做。当你知道一个简单的解决方案时，不要寻找奇特的解决方案，并且它可以工作。

来源

2012-01-05 21:53:52 cdeszaq

将参数添加到您的淡入淡出功能以指定淡入淡出方向。 1/-1,0/1，t/f等等，并把它传递给你的animatefadein。

然后你不得不

<img src="..." onmouseover="fadein('rolloverwrapper', 1)" onmouseout="fadein('rolloverwrapper, 0)" />

但是，你应该考虑使用jQuery的这种事情。与JS的这几行相比，图书馆将是一个“沉重的”，但您获得的灵活性非常大。

来源

2012-01-05 21:55:32

是啊，我只是不知道Jquery的所有，但还好，所以我将如何添加参数的方式我正在这样做，我想我将不得不重新开始或不开始？它会拉开它不分开始我猜 – 2012-01-05 22:00:32

尝试是这样的：

<script type="text/javascript"> 
    function fade(objectID, amount) { 
     var MIN_OPACITY = 0; 
     var MAX_OPACITY = 1; 

     object = document.getElementById(objectID); 

     animatefade = function() { 
      if(object.style.opacity < MAX_OPACITY && object.style.opacity > MIN_OPACITY){ 
       var current = Number(object.style.opacity);  
       var newopac = current + amount; 
       object.style.opacity = String(newopac);  
       setTimeout('animatefade()', 100); 
      } 
     } 
     animatefade(); 
    } 
</script>

用下面的HTML：

<img src="images/dj.png" onmouseover="fade('rolloverwrapper', 0.1);" onmouseout="fade('rolloverwrapper', -0.1);"/>

来源

2012-01-05 21:59:12

我认为这是接近，但它不起作用，它实际上使img dj.png消失 – 2012-01-05 22:05:39

Javascript fadein鼠标悬停工作，但不fadeout

回答

相关问题