L'opacité Div ne fonctionne pas

J'ai une minuterie sur ma div qui change l'opacité de la div. Mais pour une raison quelconque, les maths continuent de le définir à 0,1 encore et encore. Et je ne sais pas pourquoi!L'opacité Div ne fonctionne pas

Ceci est mon code:

function do_it(div){ 
    var opac = parseInt(div.style.opacity); 

if(opac == 1){ 
    var dir = 'down'; 
} else if(opac == 0) { 
    var dir = 'up'; 
} 

if(dir == 'down'){ 
    opac -= 0.1; 
} else { 
    opac += 0.1; 
} 

if(opac > 1){ 
    opac = 1; 
} else if(opac < 0){ 
    opac = 0; 
} 

div.style.opacity = opac; 
div.timer = setTimeout(function(){ do_it(div) }, 1000); 

}

ont fourni un violon:

JSFiddle

L'opacité div devrait passer de 1 à 0 et sauvegarder à nouveau dans les étapes de 0.1

Source

2013-07-20 Sir

Ceci est votre problème

var opac = parseInt(div.style.opacity);

Il devrait être parseFloat

var opac = parseFloat(div.style.opacity);

Source

2013-07-20 05:28:53 seanmk

Ah okay! merci :) – Sir

@Dave - OT, mais en utilisant 'parseInt', n'oubliez pas de fournir la base. Autrement JS essayera d'être intelligent en analysant, que vous ne pouvez pas vouloir. Voir [mdn] (https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/parseInt) pour plus de détails. – tjameson

+1 bonne prise !!! – alfasin

function do_it(div,output){ 
    var opac = parseFloat(div.style.opacity); 
    opac -= 0.1; 
    if(opac<=0.05){ 
    opac = 1; 
    } 
    div.style.opacity = opac; 
    output.innerHTML = opac; 
    div.timer = setTimeout(function(){ do_it(div,output) }, 1000); 
} 

var div = document.getElementById('test'); 
var output = document.getElementById('op'); 
do_it(div,output);

analyser un certain nombre
- parseInt (0,9) ==> 0
- parseFloat (0,9) == > 0,9
il n'y a pas besoin de vars supplémentaires lik updown

http://jsfiddle.net/ckBFy/29/

Source

2013-07-20 05:36:24 jinwei

Vous devriez voir l'intention originale de l'OP reflétée à travers son code: il ne voulait pas "contourner" en sautant de zéro à un et redescendre ensuite - il voulait descendre de 1 à zéro puis de zéro à un en sauts de -0.1/+ 0.1 respectivement. Il l'a également exprimé à la dernière ligne de la question. – alfasin

Même si il y a déjà une réponse acceptée, je voudrais ajouter que je pense qu'il ne fonctionne toujours pas le chemin c'était censé.

Voici un lien vers my demo (la façon dont je crois que cela aurait dû marcher). Et voici ma version corrigée du code:

way = 'down'; 
function do_it(div,output){ 

    var opac = parseFloat(div.style.opacity); 

    if(opac >= 1){ 
     way = 'down'; 
    } 
    else if(opac <= 0.2) { 
     way = 'up'; 
    } 
    if (way === 'down'){ 
     opac -= 0.1; 
    } 
    else{ 
     opac += 0.1; 
    } 

    div.style.opacity = opac; 
    output.innerHTML = opac; 

    div.timer = setTimeout(function(){ do_it(div,output) }, 1000); 
} 

var div = document.getElementById('test'); 
var output = document.getElementById('op'); 
do_it(div,output);

Source

2013-07-20 05:46:29 alfasin

L'opacité Div ne fonctionne pas

Répondre

Questions connexes