Jadefade fadeout fadeout не работает

Я пытался понять это в течение нескольких дней, и, похоже, это не так, потому что я его затухал, но не вышел, и теперь, когда у меня есть настройка, не работает вообще. Что я упускаюJadefade fadeout fadeout не работает

JavaScript:

function fadein(objectID, amount) { 
    object = document.getElementById(objectID); 

    animatefadein = function() { 
     var MIN_OPACITY = 0; 
     var MAX_OPACITY = 1; 
     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('animatefadein()', 25); 
     } 
    } 
    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', 0.1);" onmouseout="fadein('rolloverwrapper', -0.1);"/> 
     </div> 
    </div> 
</div>

источник

2012-01-05 Chris James Champeau

Я считаю, что любое поле css преобразуется в строку, когда оно добавляется к элементу 'style'. Вам нужно будет вызвать 'parseFloat()' в поле, чтобы получить его числовое значение. –

в отличие от 'Number (object.style.opacity)'? –

Когда я сделал fade-in/fade-out, я использовал для передачи текущего значения функции в таймаут. У меня есть два примера: [link] (http://wforums.net/project/) и [link] (http://schrijnwerkerij-de-jonghe.be/Home.html) – canihavesomecoffee

Зачем изобретать колесо? Огромная библиотека jQuery сделает это за вас (не говоря уже о многих других опрятных переходах).

$("#button").fadeOut(500, function() { console.log("done"); });

будет исчезать «кнопка» в течение 500 мс и записывается «завершена» после ее завершения.

источник

2012-01-06 00:18:49 Art

Но я не хочу выцветать кнопку div, я хочу, чтобы затухать rolloverwrapper в и из, когда мышь перекатывается над совершенно другим div –

Ну jQuery сделал работу, –

Если вы смотрите на события мыши - используйте mouseenter/mouseleave вместо mouseover/mouseout. Последние не выходят из строя и, вероятно, не дадут вам такого поведения, которое вы хотите. – Art

Я полностью согласен с ответом Art Hanzel, вы должны использовать jQuery с этим. Но для того, чтобы решить проблему, измените функцию ниже (если условие не верно в вашей версии):

function fadein(objectID, amount) { 
    object = document.getElementById(objectID); 
    animatefadein = function() { 
     var MIN_OPACITY = 0; 
     var MAX_OPACITY = 1; 
     if ((amount > 0 && object.style.opacity < MAX_OPACITY) || (amount < 0 && object.style.opacity > MIN_OPACITY)) { 
      var current = Number(object.style.opacity); 
      var newopac = current + amount; 
      object.style.opacity = String(newopac); 
      setTimeout('animatefadein()', 25); 
     } 
    } 
    animatefadein(); 
}

Here рабочий пример.

источник

2012-01-06 01:03:39 legendofawesomeness

Jadefade fadeout fadeout не работает

ответ

Смежные вопросы