Note that there are some explanatory texts on larger screens.

plurals
  1. PO
    primarykey
    data
    text
    <p>Just move the <code>click</code> handler to outside your <code>snowFalling</code> function, after you generate your snowflakes:</p> <p><a href="http://jsfiddle.net/hTPyD/" rel="nofollow">JSFiddle</a></p> <pre><code>// this function is to alter the top of each snow, using the handy .each() jQuery method function snowFalling(){ // move the snow $('.snow').each(function(key, value){ // check if the snow has reached the bottom of the screen if( parseInt($(this).css('top')) &gt; windowHeight - 80 ) { // remove the snow from the HTML DOM structure $(this).remove(); } // set up a random speed var fallingSpeed = Math.floor(Math.random() * 5 + 1); // set up a random direction for the snow to move var movingDirection = Math.floor(Math.random()*2); // get the snow's current top var currentTop = parseInt($(this).css('top')); // get the snow's current top var currentLeft = parseInt($(this).css('left')); // set the snow's new top $(this).css('top', currentTop + fallingSpeed ); // check if the snow should move to left or move to right if( movingDirection === 0){ // set the snow move to right $(this).css('left', currentLeft + fallingSpeed ); }else { // set the snow move to left $(this).css('left', currentLeft + -(fallingSpeed) ); } }); // repeat the rollIt() function for each 200 microseconds window.setTimeout(snowFalling, 200); } // call the function when the document is loaded completely generateSnow(); snowFalling(); $('.snow').click(function() { alert('You Clicked'); }); </code></pre>
    singulars
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. VO
      singulars
      1. This table or related slice is empty.
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload