2009-07-10 10 views
5

Il y avait un fondu échantillon dans Internet .. http://docs.dojocampus.org/dojo/fadeOut?t=tundraDojo, comment faire événement onclick sur un DIV

mais je veux faire quelque chose de différent .. je veux que les gens cliquent directement sur le texte, puis la le texte disparaîtra.

dans mon code il y a un div renvoyer le texte

<div id='parentNode'> 
    <div id='textDiv' onClick='whenClickAnyWhereWithinThisDiv_performFadeOut()'> 
     <div id='iconDiv'/> 
     <div id='messageDiv'/> 
    </div> 
<div> 

Code comme indiqué ci-dessous, ce que je veux est, lorsque les utilisateurs cliquent partout dans le textDiv, puis l'ensemble textDiv se fanent away..hmm ..... pourquoi mon code ne fonctionne pas ???

function whenClickAnyWhereWithinThisDiv_performFadeOut() { 
    ... 
    ... 
    dojo.connect(dijit.byId('textDiv'), "onClick", fadeOutAndRemove(parentNode, textDiv)); 
} 
function fadeOutAndRemove (parent, currentDiv) { 
    // just assume i can get the parent Node, and the current div, which will be textDiv  

    var objectId = currentDiv.getAttribute('id'); 
    dojo.style(objectId, "opacity", "1"); 
    var fadeArgs = { 
     node: objectId, 
     duration: 2000 
    }; 
    dojo.fadeOut(fadeArgs).play(); 

    setTimeout(function() { parent.removeChild(currentDiv);}, 2000); 
} 

Répondre

8

Si je comprends ce que vous essayez de faire, je pense que vous pouvez accomplir avec ceci:

HTML

<div id='parentNode'> 
    <div id='textDiv'> 
     <div id='iconDiv'>this is icon div</div> 
     <div id='messageDiv'>this is message div</div> 
    </div> 
<div> 

JavaScript

// do it when the DOM is loaded 
dojo.addOnLoad(function() { 
    // attach on click to id="textDiv" 
    dojo.query('#textDiv').onclick(function(evt) { 
    // 'this' is now the element clicked on (e.g. id="textDiv") 
    var el = this; 
    // set opacity 
    dojo.style(this, "opacity","1"); 
    // do fade out 
    dojo.fadeOut({ 
     node: this, 
     duration: 2000, 
     // pass in an onEnd function ref that'll get run at end of animation 
     onEnd: function() { 
     // get rid of it  
     dojo.query(el).orphan() 
     } 
    }).play() 
    }); 
}); 

Le clic va bu bble de façon à ce que ça va être pris par textDiv.

Voici quelques liens utiles:

Permettez-moi de savoir si je mal compris votre question et je vais mettre à jour ma réponse. J'espère que cela t'aides.

Questions connexes